HOME | DD
CypherVisor — Custom-box Background Tutorial
by-nc-nd
Published: 2010-06-23 21:01:34 +0000 UTC; Views: 573596; Favourites: 12562; 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
This was so helpful! Thank you!!!!
👍: 0 ⏩: 1
I am glad that I helped you!
👍: 0 ⏩: 0
Hello. c:
I have a question; what if I just want the background and no box? I've done it before, and honestly, I can't remember how to un-do it.
Thank you in advance.
👍: 0 ⏩: 1
Just remove this part:
Body text here..
👍: 0 ⏩: 0
I can't find the image link .-.
👍: 0 ⏩: 2
Browser that you are using?
👍: 0 ⏩: 0
This? http://fc07.deviantart.net/fs70/f/2013/227/0/1/demo_by_cyphervisor-d6i84qo.jpg
Although you may already have it now :I
👍: 0 ⏩: 2
Oh that, I was confused on what it meant x
Thankies though <33
👍: 0 ⏩: 1
No problem, glad I could help
👍: 0 ⏩: 0
Hah it edited my text alright then xD
👍: 0 ⏩: 0
Hey there! I found all your tuts extremely useful btw 
👍: 0 ⏩: 1
If you stretch an image which is not a solid color (like the one here which you have showed me) it will get elongated. You can use the height property in the img tag to stretch it. You can find out what happens..
👍: 0 ⏩: 1
Do you now how I use a custom box with IE?
👍: 0 ⏩: 1
Same way... But to get the image link you should try firefox or chrome.
👍: 0 ⏩: 1
I tried using Chrome, but it wouldn't work, and I don't have Firefox
👍: 0 ⏩: 1
You can do that with chrome...
👍: 0 ⏩: 0
Let's say I have a large image I'm using for a custom box background, and I want to align the image to the left/right-
is this possible?
👍: 0 ⏩: 1
Yes, use the align property.
👍: 0 ⏩: 0
I suppose the "Donate Widget" is still unable to change the background?
Or for "Polls"?
They make my page look so blank near the bottom.. xD
👍: 0 ⏩: 1
Yes, there is but it's little complex.
👍: 0 ⏩: 0
OKay. I have a semi-long question.
If you look at my page you will notice that all of my BGs don't fit to the entire custom box. You said that you could stretch them, but it might affect the polka dot pattern. Since you can stretch them though, what height and width should I use? Should I go back into my drawing program an make them wider? Also, how wide would they need to be? (pixel wise)
If you know another way to fix this then please tell me
👍: 0 ⏩: 1
Seems like you have fixed it to me!
Anyways, width having 1000+px is sufficient enough. The height could be anything according to your need.
👍: 0 ⏩: 1
Thanks. I actually changed my backgrounds to some pre-made ones and they fit fine. Thanks again!
👍: 0 ⏩: 1
all of a sudden recently my image has like cut off to fit the entire image, like before it would be zoomed in to till the entire space 
👍: 0 ⏩: 0
Great! Thank you very much for sharing
👍: 0 ⏩: 1
I do not speak very good English but if that teaches how to make the background of your image moves, I can't do it
👍: 0 ⏩: 1
Are you asking about the tutorial widget box?
👍: 0 ⏩: 1
I mean the background pattern profile, I don't now to do it move :S
👍: 0 ⏩: 1
You need to be premium to use this.
👍: 0 ⏩: 1
Whenever I paste the url it ends up as a link. Can someone plz help me???
👍: 0 ⏩: 1
You are probably copying the url address instead of the image url.
👍: 0 ⏩: 1
oh... Yeah I'm using google chrome do you know what I'm supposed to do though?
👍: 0 ⏩: 1
It is explained in the tut (with screenshot). Aren't you getting the "copy image url" option?
👍: 0 ⏩: 1
Yes I am but when I paste it, it ends up as a link
👍: 0 ⏩: 1
You are copying the URL address most probably instead of the image URL
👍: 0 ⏩: 0
If you submit your custom box bg, how do you get the direct link on deviantart?
👍: 0 ⏩: 1
right-click on the image (in full view) and select copy image location (the option may vary from browser to browser)
👍: 0 ⏩: 0
I'm soooo confused -.-
I want to use this pic--> imageshack.us/a/img818/6100/rv…
But the entire code thing is confusing the crap out of me :/
Would you be able to send me the code so I can just put it into my custom box?
👍: 0 ⏩: 1
Use this image link in the code: http://imageshack.us/a/img818/6100/rvdf.jpg
👍: 0 ⏩: 1
Where do you find the code tho? :/
👍: 0 ⏩: 1
Right-click on the image and select copy image location (option varies from browser to browser)
👍: 0 ⏩: 1
<= Prev | | Next =>