HOME | DD
CypherVisor — Custom-box Background Tutorial
by-nc-nd
Published: 2010-06-23 21:01:34 +0000 UTC; Views: 573493; Favourites: 12564; Downloads: 0
Redirect to original
Description
»»»»»»»»»»»»»»»»»»»»»»»»»»» Exclusively for Premium members and Super groups only «««««««««««««««««««««««««««Updated: 23-Feb-2014
How to use ?Just copy the source code(s) below and paste it in your Custombox module in your profile or group page.
Spanish translation of this tutorial
SOURCE CODE:
Code to insert an image without stretching: (ORIGINAL CODE)
Body text here..
Code to stretch an image (It works as to repeat image ONLY FOR SOLID COLOR IMAGES though!) :
Insert the width and height in the
EXAMPLE:
Body text here..
How to insert a content-holder box inside a custom box?
Simply copy a content-holder boxes from my gallery folder here: LINK and paste it where it says "Body text here.." in the above code.
My background image link (the background that I've used for demo in this tutorial)
------------------------------------------------------------------------------------------------------------------
http://fc07.deviantart.net/fs70/f/2013/227/0/1/demo_by_cyphervisor-d6i84qo.jpg
Other tutorials
Custom background for DeviantID-box widget:
Custom background for New deviation-box widget:
The content holder box used in this tutorial
Want to customize your profile more?
Check all my free resources + tutorials: somrat.deviantart.com/gallery/…
Having any doubt? Please read this F.A.Q. + Tips n Tricks before writing a comment below.
I am a free resource provider for the deviantART community. If you like my free customization resources you can donate some
points
to me as an appreciation or support.I take commissions to make custom journal CSS too. Check out my Journal CSS folder or Read-made Journal Skins . Send me a note to contact me.
Related content
Comments: 3487
Hmm? Can't be!
You must be doing a mistake somewhere. Check the tutorial thoroughly and also see the previous comments.
👍: 0 ⏩: 1
I was just so stupid xd but now I learn (from many mistakes xD)! Thank you for great tutorials x3!!
👍: 0 ⏩: 1
Nothing to be stupid here.
And my pleasure!
👍: 0 ⏩: 0
What are you confused with?
👍: 0 ⏩: 1
I honestly don't understand what this means... I know it's for the background... but I don't know anything about how the link is supposed to work.
👍: 0 ⏩: 0
ahh! I can't do it! It keeps making it a URL picture or a link! help!
👍: 0 ⏩: 1
You are taking the background image link incorrectly in that case.
Please check this journal to check how to get the background image URL Custombox F.A.Q. + Tips and tricks
👍: 0 ⏩: 1
ah thankgoodness it worked thanku!
👍: 0 ⏩: 1
Is there a code to add backgrounds, content holders, floating images & buttons to "Featured Deviation" widgets?
👍: 0 ⏩: 1
Check my tutorials folder here: cyphervisor.deviantart.com/gal…
And Custombox F.A.Q. + Tips and tricks
you should find almost all your answers there.
👍: 0 ⏩: 0
what do you mean "Body Text Here.."?
👍: 0 ⏩: 1
see the code in the description.
👍: 0 ⏩: 0
Mine used to work, but when I went to change it, I redid the whole thing and it turned out to be way too small. Please help me.
👍: 0 ⏩: 1
What turned to be too small?
👍: 0 ⏩: 1
I'm sorry, XD I fixed it. <3
👍: 0 ⏩: 1
I couldn't get this to work for some reason
👍: 0 ⏩: 1
Umm, what's wrong? Most of the times it is due to incorrect image URLs. Check the code for links properly.
👍: 0 ⏩: 1
This works on normal groups! I just cant place text over the background image (only above or under the actual image).
< div class= "gr-box gr-genericbox" >
does not work for normal groups
👍: 0 ⏩: 1
That is because it REQUIRES a group to be SUPER. In a normal group only the image will be visible but it doesn't act as a background image...
👍: 0 ⏩: 0
Well, try and see if your links are correct. It will work.
👍: 0 ⏩: 0
hello! I have a question.. what is the minimum size you can have for a custom box? I heard it is 900px across... I'm not entirely sure. I want a custom box to be large, so can the length be any size? Sorry if this is a little unclear.
👍: 0 ⏩: 1
There is no minimum size for the custom box (width wise) because it depends on your monitor's screen resolution. If your screen resolution is say 1920x1200 then the width will be around 900px may be but if your resolution is smaller say 1280x780 then it will be around 600px. So it depends.
👍: 0 ⏩: 1
How do I make it bigger?
It looks like this sta.sh/0yob3d972p2
But the url I'm using is for this pic sta.sh/028snaqbrcs3
I must be doing something wrong...
👍: 0 ⏩: 1
When you insert your content (replacing the 'body text here' part of of the code) it will automatically expand.
👍: 0 ⏩: 1
Thank you! I get it now~
This was immensely helpful
👍: 0 ⏩: 1
Anything that you want in your box (above the background image) has to be replace in the "body text here" part.
👍: 0 ⏩: 1
k thx!!!
my custom boxes now work!
👍: 0 ⏩: 1
Here, URL is the image link.
Check my tips&tricks journal for more details on how to get the image link from the description here.
👍: 0 ⏩: 0
<= Prev | | Next =>