Deviant Login Shop  Join deviantART for FREE Take the Tour
×



Details

Submitted on
January 28, 2011
Image Size
1.1 MB
Resolution
550×400
Link
Thumb
Embed

Stats

Views
67,894
Favourites
4,915 (who?)
Comments
1,208
Downloads
542

License

Creative Commons License
Some rights reserved. This work is licensed under a
Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 License.
×

Frequently Asked Questions (read this before asking)



:bulletblue: How do I put an image in my custom box?
<img src="url of image here"/>


:bulletblue: This code won't work!
I urge you to go through the tutorial and re-read it before asking me. It's hard for me to help you if I don't know the code you're using, and the code FROM THE TUTORIAL works if you copy and paste it and follow instructions.


:bulletblue: How do I make the inner box without the heading?
Please see the comment I made here, which will give you an inner box without a heading area!


I get like 10 questions a week on this. :noes:


Edited 5.15.11
This tutorial now has been edited to include how to get your image's URL if you're using Internet Explorer! :w00t:! It wouldn't have taken me so long, but Flash kept crashing whenever I tried to export my new file. ;^;



---EDIT 2---

asakedgjsdgjdkgkdgsakfjaskfj.

OHHHHHH MY GOSH.
THANK YOU SO SO SO SO SO SO MUCH FOR A DD. oAo;;;;

I don't even know what to say!! Thank you to ^namenotrequired and `wdwparksgal for being amaaaaaaazing. I'm going to go pass out from joy! :woohoo:

If you have any questions at all, please ask away and I will answer!
If I don't answer your comments right away, please don't be discouraged. ;^; I kind of wish I had cleaned my inbox yesterday now that this amazing thing happened. XD


Edit: Thanks to ~missy2spencer for pointing out a little piece I neglected to explain.




I've never used Flash before.
What was I thinking?! :faint: /heavybreathingofdistress

It's okay. :aww: I think this turned out quite well, actually. It was an amazing learning experience for me, since I've never used Flash. :omg:

This was made for #PremiumMembers's weekly contest. This week's was:
We're challenging you to think about your favorite Premium Member features and write a very short how-to or a few tips on using it!

:lol: I think the operative word was "short"...... Maybe I, err, over-did it? ^^; But really, custom boxes are amazing, and there's not a simple, short way to really explain them! So I wanted to go in-depth...

...sorry some of this presentation is absolutely crazy. The majority of it (i.e., the first several steps) were written between 2 and 4 AM last night. :giggle: I finished it up after cleaning today.

I don't know how it's going to work, or if there will be bugs. /gulp/ So if you see anything gone awry, please let me know so I can fix it. :meow:

If you have suggestions for ways to improve this, please also tell me those! :la: I hope you can take something away from this presentation!

If you thought all of this was fancy, check out the creator/discoverer of all of this fancy stuff, *SparkLum. His resources are on ~Backup-Lunari!!!
Credit to =somrat (CHECK OUT HIS GALLERY, AT LEAST), $DEVlANT, =NaiveCRIMSON, and to the other deviants whose work I cited in there, or whose pages I displayed as an example. :aww:

Hmm, I think that that's it.

Enjoy!!
`SanguineEpitaph

Codes and Images used/Helpful Links:
My background image: [link]

Custom Background Tutorial

To add your background image **remove the spaces**:
< div class="popup2-moremenu" >< div class="floaty-boat" >< img src="YOUR-IMAGE-URL-GOES-HERE" />< /div >< /div >

To add an inner box **remove spaces**:

< div class="gr-box" >
< div class="gr-box gr-genericbox" >< div class="gm-controls" >< /div >< i class="gr1" >< i>< /i>< /i>< i class="gr2" >< i>< /i>< /i>< i class="gr3">< i>< /i>< /i>< div class="gr-top" >< i class="tri" >< /i >< div class="gr" >< i class="icon i30" >< /i >< div class="thumb-holder cc-name" >BOX HEADING</div >< /div >< /div >< div class="gr-body"><div class="gr" >< div class="grf-indent pp">
CONTENT GOES HERE!!
</div >< /div>< /div>< i class="gr3 gb" >< /i >< i class="gr2 gb"></i >< i class="gr1 gb gb1" >< /i>
</div >

Buttons: [link]
Buttons:
[link]
Moar buttons:
[link]

The biggest resource of all: :iconwoooplz:
[link]
Add a Comment:
 

Daily Deviation

Given 2011-04-06
Sexify Your Page: Custom Boxes by =SanguineEpitaph CATEGORY: deviantART Related / deviantART Tutorials The Suggester states, ".....a great tutorial explaining its subject, in sufficient detail but still clear enough to be understood by people who have no experience with it. Also contains links to many other helpful resources, and I love the visual of it too!" ( Suggested by namenotrequired and Featured by WDWParksGal )
:iconkonatachanjapan:
Dear SanguineEpitaph,
As a premium member myself i really enjoyed learning how to customize my boxes with your flash tutorial tutorial.
This flash tutorial is great. There are many nice graphics displayed through out the tutorial. Great for visual learners :)The text is very descriptive throughout the entire tutorial making it very easy for deviant artists of all levels of experience to achieve. I love how its not too much text. Its just the right amount making it easy to understand. I suggest all deviants looking to customize their page and boxes use SanguineEpitaph's wonderfull tutorial to achieve box customization.
What do you think?
The Artist thought this was FAIR
251 out of 259 deviants thought this was fair.

:iconmasqurade-chan:
Being a first time with a preimium membership, this tutorial helped me finally understand how to put a BG on my custom boxes. It turned out great. The steps are eays to follow and understand. The code is practically written out for you and you don't have to think about "how do I do this" or "how do I do that" because (as I said before) it is CLEARLY explained.

This is an amazing step by step tutorial for putting a BG on your custom box.

Great job. I am more than satisfied with this. You have earned the DD.
What do you think?
The Artist thought this was FAIR
147 out of 149 deviants thought this was fair.

The Artist has requested Critique on this Artwork

Please sign up or login to post a critique.

:iconangelannaleah:
AngelAnnaleah Apr 7, 2014  New member Student Artist
This is so confusing... I added both codes inside the "Contents" Box and it then gave me "CUSTOM" and "BOX HEADING"
Please help me.... or am I that $tup!d? No, I disagree! 
Reply
:iconkageto-hirari:
KageTo-Hirari Apr 7, 2014  Hobbyist Artist
Thank you so much!
This is really helpful! Now I, too have a sexy page!!
Reply
:iconviinterox:
what about if you want a different size of the picture?
Reply
:iconchillisart:
chillisart Mar 28, 2014  Hobbyist Digital Artist
Is there a way to tile (or repeat) a custom back background?
Reply
:iconsakusay:
SakuSay Mar 19, 2014  Hobbyist Artisan Crafter
Awesome tutorial! Thank you so much!
Reply
:iconthedarkbladehuntress:
Ghaaa this has been a HUGE help, but i gots a little problem..

When i try to use a background image and i have the codes and everything all worked out and correct and when i click save the background image OVERLAPS everything. Like i have stickers and stuffs and the background image completely covers those up. And when i try to have the background image go on my profile image, the background completely covers that to! :Frustrated: :frustrated: 'Revamp' 
Reply
:iconfatherluna:
FatherLuna Mar 11, 2014  Hobbyist Digital Artist
I about died on the inside.. I thought it said "This shiz is 100% locked" XD
Reply
:iconaurora-dreams:
Aurora-Dreams Mar 5, 2014  Hobbyist General Artist
How can I use two boxes in one widget?
Reply
:iconbulleus:
Bulleus Mar 4, 2014  Student Digital Artist
Question: Can Premium Members Embed SWF in the Custom Box using the Embed Link that dA provided?
Reply
:iconclaimyourself:
ClaimYourself Mar 3, 2014  Professional General Artist
I love this tutorial. it helped me figure out how to do this and also made me laugh :D
Heart 
Reply
Add a Comment: