HOME | DD
Astrikos — PE: How to embed things (WILL UPDATE FOR ECLIPSE)
Published: 2013-05-08 11:25:20 +0000 UTC; Views: 135804; Favourites: 1700; Downloads: 0
Redirect to original
Description
body div#devskin9188635 .gr-box { overflow:visible; background:transparent; margin:190px auto 0px auto; position:relative; padding:0px 10px 10px 10px; } body div#devskin9188635 .gr-top { display:none; } body div#devskin9188635 .gr-top .gr { display:none; } body div#devskin9188635 .gr-top h2 img { display:none; } body div#devskin9188635 .gr-top h2 { display:none; } body div#devskin9188635 .gr-body { background:#dae4d9 url(https://fc06.deviantart.net/fs71/o/2013/024/2/b/350289350_646739_322748439_464982_bggrad.png) 0px 0px repeat-x; border:1px solid #a6b2a6; overflow:visible; color:#5d625d; line-height:20px; padding:30px 0px 0px 0px; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; box-shadow:0px 1px 5px #8c9688; -moz-box-shadow:0px 1px 5px #8c9688; -webkit-box-shadow:0px 1px 5px #8c9688; box-shadow:0px 1px 5px #8c9688; -moz-box-shadow:0px 1px 5px #8c9688; -webkit-box-shadow:0px 1px 5px #8c9688; } body div#devskin9188635 .gr { background:transparent; border:none; } body div#devskin9188635 .gr-body .gr { padding:0px 20px 0px 20px; } body div#devskin9188635 .gr-body .gr .text { padding:10px 0px 0px 0px; } body div#devskin9188635 i.tri { display:none; } body div#devskin9188635 i.gr1 { display:none; } body div#devskin9188635 i.gr2 { display:none; } body div#devskin9188635 i.gr3 { display:none; } body div#devskin9188635 i.gb { display:none; } body div#devskin9188635 .top { position:absolute; top:-174px; left:0px; right:0px; width:100%; text-align:center; z-index:50; } body div#devskin9188635 .top img { margin:0px auto; min-width:529px; } body div#devskin9188635 div.board { width:360px; height:217px; background:url(https://fc03.deviantart.net/fs71/o/2013/024/d/d/350289350_646740_322748439_464983_pinboard.png) top right no-repeat; text-align:center; z-index:99; margin:-50px auto 0px auto; position:relative; } body div#devskin9188635 div.board .shadow-holder { float:left; top:0px!imporant; left:0px!important; } body div#devskin9188635 div.board img.avatar { position:absolute !important; display:block; margin:0px 0px 0px 0px; bottom:-18px; right:-75px; } body div#devskin9188635 span.board { display:none; } body div#devskin9188635 div.board .stamp { position:relative !important; left:20px; top:50px; } body div#devskin9188635 div.board .stamp img { box-shadow:0px 1px 5px #4d1e1c; -moz-box-shadow:0px 1px 5px #4d1e1c; -webkit-box-shadow:0px 1px 5px #4d1e1c; box-shadow:0px 1px 5px #4d1e1c; -moz-box-shadow:0px 1px 5px #4d1e1c; -webkit-box-shadow:0px 1px 5px #4d1e1c; } body div#devskin9188635 div.board .gallery { position:relative !important; right:78px; top:80px; color:#fff !important; font-size:20px; font-weight:bold; text-align:right; width:325px !important; text-shadow:#4d1e1c 0px 1px 3px; } body div#devskin9188635 div.board a { color:#fff !important; font-size:20px; font-weight:bold; } body div#devskin9188635 a { color:#B73E62; text-decoration:none; } body div#devskin9188635 a:hover { color:#E43A5D; text-decoration:none; } body div#devskin9188635 ul { margin:0px 0px 0px 0px!important; } body div#devskin9188635 ul li { list-style-image:url('https://fc05.deviantart.net/fs71/o/2013/024/6/0/350289350_646741_322748439_464984_bullet.gif')!important; } body div#devskin9188635 li b { color:#fff !important; font-size:14px; font-weight:bold; text-shadow:#8c9688 0px 1px 3px; padding:0px 12px 0px 0px; } body div#devskin9188635 li b sup { font-size:10px; font-weight:normal; } body div#devskin9188635 .list { display:none!important; } body div#devskin9188635 .bottom { position:absolute; right:6px; bottom:6px; color:#DAE4D9!important; z-index:99; padding:0px 0px 0px 0px!important; height:27px; font-size:0px; } body div#devskin9188635 .bottom .commentslink { font-size:0px; background:url(https://fc02.deviantart.net/fs70/o/2013/024/8/d/350289350_646742_322748439_464985_comment.png) top no-repeat; color:#DAE4D9!important; text-decoration:none!important; padding:0px; margin:0px 15px 0px 10px; text-align:center; width:24px!important; height:24px!important; display:block; } body div#devskin9188635 .clear_ { clear:both!important; } body div#devskin9188635 .week { background:url(https://fc08.deviantart.net/fs71/o/2013/024/c/c/350289350_646743_322748439_464986_sepdots.gif) bottom repeat-x; padding:0px 0px 0px 80px; margin-top:-22px; } body div#devskin9188635 .week .cal { background:url(https://fc02.deviantart.net/fs71/o/2013/024/7/b/350289350_646744_322748439_464987_cal.png) top no-repeat; width:76px; height:38px; float:left; margin:0px 0px 0px -80px; text-align:center; color:#f2fbf0; text-shadow:#8c9688 0px 1px 2px; } body div#devskin9188635 .week .left { position:relative !important; left:3px; top:-6px; float:left; margin:0px!important; font-size:17px; font-weight:bold; width:30px; height:30px; } body div#devskin9188635 .week .left b { color:#96a791!important; font-size:8px; line-height:14px; text-shadow:#fff 0px 1px 0px!important; } body div#devskin9188635 .week .right { float:right; position:relative !important; left:-3px; top:-26px; margin:0px!important; font-size:17px; font-weight:bold; width:30px; height:30px; } body div#devskin9188635 .week .right b { color:#96a791!important; font-size:8px; line-height:14px; text-shadow:#fff 0px 1px 0px!important; } body div#devskin9188635 .header { font-size:24px; margin-top:-12px; font-weight:bold; font-family:Trebuchet, Tahoma, Arial, sans-serif; padding:0px 0px 0px 5px; color:#B73E62; text-shadow:#fff 0px 1px 0px!important; } body div#devskin9188635 .links { float:right; position:relative; bottom:20px; right:0px; } body div#devskin9188635 .links img { padding-left:8px; } body div#devskin9188635 .buttons { position:absolute; left:20px; bottom:6px; color:#DAE4D9!important; z-index:99; padding:0px 0px 0px 0px!important; height:27px; font-size:0px; } body div#devskin9188635 .buttons img { padding-right:8px; } body div#devskin9188635 blockquote { background:#E9F2E9; border:2px ridge #FF1966; margin:1.5em 10px; padding:.5em 10px; } body div#devskin9188635 blockquote:before { color:#9B9DA3; font-size:5em; line-height:.1em; margin-right:.25em; vertical-align:-.4em; } body div#devskin9188635 blockquote p { display:indent; } body div#devskin9188635 .box { background:#fff; box-shadow:3px grey; -moz-box-shadow:3px grey; -webkit-box-shadow:3px grey; border:2px solid#e5e5e5; padding:7px; margin:auto; text-align:center; text-decoration:none; letter-spacing:0px; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; line-height:normal; overflow:auto; float:center; } body div#devskin9188635 h1, body div#devskin9188635 h2, body div#devskin9188635 h3, body div#devskin9188635 h4 { font-weight:normal; }
Written by Astrikos for projecteducate 's community week.
You may have noticed GIFS and hot things in people's journals and profiles.
With HTML and CSS, you can add some hotness to your journals and profile.
Pretty neat, yes?
Embedding Images and GIFsDeviantART Images
Images on dA can easily be linked with thumbcodes.
While on a deviation page, all you have to do is scroll down and look right until you see:
Copy and paste the thumb code.
:thumb367944988:
:thumb367944988:
And if you want it bigger:
:bigthumb367944988:
And bam. There you are.
If that's not good enough, you can play around with the size like this.. .
It's the thumbcode number without thumb in it... Trying it out... Gives us: If you want to play with height of dA deviations (with HTML) , you will need to use the method explained below. All kinds of images, not just deviantART ones With this method, you can link any image you want from the internet(including dA images) , however, HTML is involved. And now.... Go find your adorable/sexy GIF/Image on wherever. Tumblr is especially useful. So is google. Express yourself. The code is... That's it! Easy. Right click, then select Copy Image URL to get the direct image URL. And then you're done! Resizing: You can resize things the HTML way. (Width: 310) (height: 430) (Code: Default sizing Or for deviantART images, sta.sh, all you need to do is drag and drop and resize that way. (in Journals) You can resize the HTML Way.. However, you need to have images that link to the deviation. Linking Images Perhaps you want to create a graphic for your profile page that links to something else. First, find your image and upload it to st.ash or any other hosting program. Like flickr, tinypic, etc. I find sta.sh to be much quicker. I'll use project educate's header image: I the image URL so I right click on the image, Not : http:/communityrelations.deviantart.com/journal/Project-Educate-Continues-261205783 (this is from the address bar, not from right clicking and getting 'copy image URL'.) I take the image URL and paste it into this code format: <a href="whatyouwanttheimagetolinkto.com"> Click it! It will redirect you to project educate! You can also apply the resizing methods shown above. Embedding Video You can also embed snazzy youtube videos into your journals! Take a look at this code: Note: The ID means this.... http://www.youtube.com/watch?feature=player_profilepage&v=CIx0P1KDkVk An example would be And that gives us: Compatible video types: Embedding a music player Good luck and happy embedding! If you have questions, you may comment below!
and select copy image URL. 
For your direct image URL, you can find by right clicking and selecting copy image URL. It will end in an image file extension. (.jpg,..png,.gif,etc.)
In our example, this gives us the code:
<a href="projecteducate.deviantart.com"> <img src="http://fc01.deviantart.net/fs70/o/2013/024/0/0/350289350_646745_322748439_464988_header2.png"><a>
Related content
Comments: 779
👍: 0 ⏩: 0
👍: 8 ⏩: 1
👍: 3 ⏩: 0
👍: 1 ⏩: 0
👍: 1 ⏩: 1
👍: 1 ⏩: 0
👍: 2 ⏩: 2
👍: 0 ⏩: 0
👍: 0 ⏩: 1
👍: 0 ⏩: 0
DA must've changed something. Tried embedding an image in my artwork description and all it shows is a link. Maybe I did something wrong, dunno, but I followed your tutorial.
👍: 0 ⏩: 1
👍: 1 ⏩: 0
👍: 0 ⏩: 0
👍: 0 ⏩: 0
when i right click, it shows "copy image address" which i assume means the same. however when i paste the img html into the code it wont work. please help ;-;
👍: 0 ⏩: 0
Do you have to be a core member to do this? I tried both the thumbnail way and the image source way, but neither one worked
👍: 0 ⏩: 0
How the heck do I get the image source? When I attempt to do it for a fan button I made, I just get an awfully long link. It doesn't even work, and now I'm getting stressed!
👍: 0 ⏩: 0
How do I embed images in literature pieces?
👍: 0 ⏩: 0
Hi! I could have sworn I’ve been to this blog before but after browsing through some of the post I realized it’s new to me. Anyhow, I’m definitely delighted I found it and I’ll be book-marking and checking back often! international haulage price
👍: 0 ⏩: 1
👍: 0 ⏩: 0
Thank you for extra excellent blog. Exactly where else could i recieve this particular compassionate of information written in this kind of incite complete way? i have been seeing with regard to this kind of fine detail. how to play rummy online
👍: 0 ⏩: 1
👍: 0 ⏩: 0
Please keep on posting such quality articles as this is a rare thing to find these days. I am always searching online for posts that can help me. watching forward to another great blog. Good luck to the author! all the best! review stormlikes
👍: 0 ⏩: 0
Pretty good post. I just stumbled upon your website and wanted to say that I have incredibly enjoyed reading your blog posts. Any way I am going to be subscribing for the feed and I hope to visit your article once again soon. cheap water bottles singapore
👍: 0 ⏩: 0
I’m truly enjoying the design and layout of your website. It’s a very easy on the eyes which makes it much more pleasant for me to come here and visit more often. Did you hire out a developer to create your theme? Great work! voyance par telephone gratuite
👍: 0 ⏩: 0
On the off chance that Google has a spot devoted to you at the top particularly in the event that it is a high level posting with different subpages recorded beneath the principle landing page it gives your site a position and brand value that no advertisement can beat. SEO Course Singapore
👍: 0 ⏩: 0
Hey there! I know this is somewhat off topic but I was wondering if you knew where I could locate a captcha plugin for my comment form? I’m using the same blog platform as yours and I’m having trouble finding one? Thanks a lot! buy automatic instagram likes
👍: 0 ⏩: 0
An fascinating discussion is worth comment. I believe that you need to write read more about this topic, may possibly not be described as a taboo subject but generally everyone is too few to chat on such topics. An additional. Cheers House Painting Sydney
👍: 0 ⏩: 0
👍: 0 ⏩: 0
Exactly why would you continue removing my comments? I have a few really unquie things to say, however my comments never display. Have I done anything erroneous, because if I have then there has to be a mistake. Please reply, thanks! thepornguy.org
👍: 0 ⏩: 0
the Thumb code doesnt work in deviantart submissions. all it does is show the thumb code, not the image. html doesnt work either /:
unless im doing something wrong.
like always?
👍: 0 ⏩: 0
Oh my goodness! a great post dude. Thanks a ton Even so We are experiencing issue with ur rss . Don’t know why Not able to subscribe to it. Will there be any person acquiring identical rss dilemma? Anybody who knows kindly respond. Thnkx more info
👍: 0 ⏩: 0
After study some of the web sites with your site now, and I genuinely like your technique for blogging. I bookmarked it to my bookmark site list and are checking back soon. Pls consider my internet site likewise and tell me what you believe. Voegwerken
👍: 0 ⏩: 0
When I originally commented I clicked the -Notify me when new surveys are added- checkbox and already each time a comment is added I purchase four emails with the same comment. Will there be any way you may get rid of me from that service? Thanks! sgx nifty
👍: 0 ⏩: 0
Pretty section of content. I just stumbled upon your website and in accession capital to assert that I get actually enjoyed account your blog posts. Anyway I will be subscribing to your feeds and even I achievement you access consistently quickly. RAMPANT RABBIT VIBRATOR
👍: 0 ⏩: 0
When I originally commented I clicked the -Notify me when new surveys are added- checkbox and already whenever a comment is added I am four emails sticking with the same comment. Can there be any way you are able to eliminate me from that service? Thanks! coworking space
👍: 0 ⏩: 0
After study many of the blog posts on your own internet site now, and i genuinely much like your means of blogging. I bookmarked it to my bookmark internet site list and are checking back soon. Pls check out my website as well and let me know what you think. getinmate.com/
👍: 0 ⏩: 0
After examine a few of the blog posts on your website now, and I really like your method of blogging. I bookmarked it to my bookmark web site listing and will likely be checking again soon. Pls take a look at my web page as properly and let me know what you think. pretpark Bobbejaanland overnachten
👍: 0 ⏩: 0
Aw, i thought this was quite a nice post. In notion I would like to put in place writing such as this additionally – taking time and actual effort to generate a very good article… but so what can I say… I procrastinate alot and also no means manage to go completed. keyword research for niche marketing
👍: 0 ⏩: 0
Hmm that was weird, my comment got eaten. Anyway I wished to say that it is really nice to know that another person else also described this as I had problems acquiring the similar data elsewhere. This was the first location that advised me the remedy. Many thanks. business in Dubai
👍: 0 ⏩: 0
What if its a deviant submission (an art) as non-core member? ;( doesnt work for me
👍: 0 ⏩: 0
There are a handful of intriguing points with time in this post but I don’t know if I see them all center to heart. There’s some validity but I am going to take hold opinion until I look into it further. Good article , thanks and now we want more! Put into FeedBurner also TYPHOID
👍: 0 ⏩: 0
| Next =>