Shop Mobile More Submit  Join Login
Pretty Up Your Profile 2.0 (Beginner) by Gasara Pretty Up Your Profile 2.0 (Beginner) by Gasara
This has drained me emotionally and physically.

I've been meaning to update the original tutorial for a while now but only just managed to get around to doing it. I'd forgotten how long tutorials take me to make and how much I don't really enjoy making them, haha. All that screencapping and cutting and pasting... But this is for you, guys, and that makes it worth it.

As you can probably tell from the ridiculous length of this I've gone into a little more detail about the areas covered and provided better images for those of you who prefer to follow visual tutorials. You don't need to be put off by the length as everything's really simple to do and you can just skip to the code if you want to. Those of you who are new to this or want a little more insight can take your time and go through it at a slower pace. It might even help to copy code directly from my examples just to get a feel for things.

There are a few things that I still want to cover but I'm going to save them for another tutorial - let us have a break first. In that I'll cover content holders, buttons and journal skin integration. These'll be slightly more advanced topics but still easy enough to learn.

Also, I have decided to leave the original tutorial up because I know a lot of you still use that and it's certainly more compact. I figured some people might prefer that for quick reference too. You'll have the choice of using whichever tutorial works best for you.

And with that I'll leave you to your profile prettying. Enjoy!



Custom Widget Background Code

<div class="popup2-moremenu">
<div class="floaty-boat"><img src="BACKGROUND IMAGE URL"></div></div>
<div class="gr-box gr-genericbox">

YOUR CONTENT

</div>
Add a Comment:
 
:iconponykittyartist02:
PonyKittyArtist02 Featured By Owner Jul 23, 2015  New Deviant Hobbyist Artist
I'm on mobile so I don't know where the edit page button is ;;
Reply
:iconarandomvelociraptor:
ArandomVelociraptor Featured By Owner Jun 14, 2015  Hobbyist General Artist
The code for the custom widget background doesn't work for me at all. Do you think you could help me?
Reply
:iconcelerise:
Celerise Featured By Owner Jul 19, 2015  Student General Artist
A much easier way to add a background is by doing this:
Grab the URL of the image you want, and go to da, Type in the box "custom box code" a little box should pop up and click it! It  should have a long strip you can enter the text in, Put the URL in there, and go to where it says "Preview" click it and you should see your background and "YOUR TEXT / EMOTES/ THUMBS" wrote in text in the middle.

You can even have boxes to write in by it.
Reply
:iconarandomvelociraptor:
ArandomVelociraptor Featured By Owner Jul 19, 2015  Hobbyist General Artist
Thanks!
Reply
:iconcelerise:
Celerise Featured By Owner Jul 19, 2015  Student General Artist
No problem!
Reply
:iconponyoftardis:
PonyOfTardis Featured By Owner Jun 1, 2015  Hobbyist Digital Artist
What do I change gr-box gr-genericbox to when I add a background to my donation box? When I use use the code above my donate goal box disappears.  You can see what I mean on my profile :\
Reply
:iconhk-0391:
HK-0391 Featured By Owner May 24, 2015   Digital Artist
Capture by HK-0391 <-- Did I do something wrong?
Reply
:iconamufujibioshi:
AmuFujibioshi Featured By Owner Jul 17, 2015  Student General Artist
you want to center the image by using the code
in front of the code you used to put the picture in

If this doesn't work I'm sorry!
Reply
:iconteddileah:
teddileah Featured By Owner May 2, 2015  Student General Artist
; u ; Ahh, okay, one question. So how do I make a picture bigger when I use the "thumb"? Because whenever I do that, the picture is really small. 
Reply
:icontotalconflagration:
TotalConflagration Featured By Owner Jun 27, 2015  Hobbyist Traditional Artist
I know you posted this a while ago, but if you take the normal :thumb(whatever): and change it to :bigthumb(whatever): it'll make it a bit bigger.
Reply
:iconteddileah:
teddileah Featured By Owner Jul 2, 2015  Student General Artist
Ahh! This is what I was looking for! Thanks so much! :la: :heart:
Reply
:icontotalconflagration:
TotalConflagration Featured By Owner Jul 2, 2015  Hobbyist Traditional Artist
No problem!
Reply
:iconzombiegladospony:
ZombieGLaDOSPony Featured By Owner May 5, 2015  Student Digital Artist
<img src="IMAGE URL">
Reply
:iconteddileah:
teddileah Featured By Owner May 5, 2015  Student General Artist
Thanks!!
Reply
:iconzombiegladospony:
ZombieGLaDOSPony Featured By Owner May 5, 2015  Student Digital Artist
np ^^
Reply
:iconteddileah:
teddileah Featured By Owner May 5, 2015  Student General Artist
x) 
Reply
:iconchisana-kuma:
chisana-kuma Featured By Owner Apr 19, 2015  Student Artist
yay!~ :tea:
i am not a premium member, but my profile is still rockin my socks
thank you so very much!
Reply
:iconpunkmiketaylor:
PunkMikeTaylor Featured By Owner Apr 18, 2015  Hobbyist Digital Artist
Very helpfull. Thank you :D
Reply
:iconkarinchan97:
karinchan97 Featured By Owner Feb 16, 2015  Student General Artist
Thanks for this amazing tutorial!
Reply
:iconenide-kant:
Enide-Kant Featured By Owner Jan 29, 2015  Hobbyist Digital Artist
Amazing Tutorial!! a lot of work!! Thaaank you so much! :hug:
Reply
:iconvenomlestrange:
VenomLeStrange Featured By Owner Jan 17, 2015  Hobbyist Digital Artist
This was HUGELY helpfull!
I only have one question: is it possible to add a background to the Gallery Box? Thank you!
Reply
:iconequinelullaby:
EquineLullaby Featured By Owner Jan 18, 2015  Hobbyist General Artist
it is but then you have to manually add the deviations in,as the BG will cover up the originals 
Reply
:icondemonshark151:
Demonshark151 Featured By Owner Jan 5, 2015  Hobbyist Digital Artist
This is so helpful! Thank you for making this! ヽ(;▽;)ノ
Reply
:iconcaptain-starburst:
Captain-Starburst Featured By Owner Dec 27, 2014  Student General Artist
If I may ask, how did you get a background on the rest of your boxes that arent a custom box?
Because Ive tried rearranging where the code goes, but it Always Covers up everything there.
Reply
:iconyour-horse-face:
Your-Horse-Face Featured By Owner Nov 20, 2014
How do you get a picture on the side in my daID? like see how p-ragmatic has their Jean Kirstein picture on the side?
I know about the <img src="IMAGE HERE"> 
Could you possibly tell me?
Reply
:iconredkubby:
redkubby Featured By Owner Oct 30, 2014  Hobbyist
Thank you, so much! :D You helped me a lot!
Reply
:iconsmccreations:
SMCCreations Featured By Owner Sep 25, 2014  Hobbyist Digital Artist
I cannot thank you enough!  ♥Heart +fav 
Reply
:iconbluemoon4601:
BlueMoon4601 Featured By Owner Sep 24, 2014  Hobbyist Traditional Artist
I can't read it, it's too small. and when I save it as a picture, it's too blurry. Really Sad 
Reply
:iconwaltzthroughthestars:
WaltzThroughTheStars Featured By Owner Nov 16, 2014  Hobbyist Digital Artist
Click on it to enlarge it.
Reply
:iconbluemoon4601:
BlueMoon4601 Featured By Owner Nov 24, 2014  Hobbyist Traditional Artist
thanks
Reply
:iconhopeswings777:
HopeSwings777 Featured By Owner Sep 16, 2014
I'd like to post some literature with one of those pretty background pages. Are the guidelines for custom boxes on dA the same for literature templates ? I can upload one of the templates successfully, but I can't figure out how to add my text (poems or essays). I was afraid that I might have to resort to layers in MS Paint, which I know almost nothing about. Also, I tried to use one of those lit templates on Muro, but I couldn't make it work there either. (I've never successfully used digital layers  in any form) 
Reply
:iconpenguinity:
Penguinity Featured By Owner Sep 12, 2014   General Artist
THANK YOU, this is so helpful! :hug:
Reply
:iconfro7a:
Fro7a Featured By Owner Sep 2, 2014  Student Digital Artist
Gorgeous one!
How can I add a box inside the custom box itself?
I mean like what she has in her profile :iconkezzi-rose:
Reply
:icongasara:
Gasara Featured By Owner Sep 7, 2014
Ah, you'll CypherVisor and his content holder codes. He has a bunch of different types in his gallery that you can use.

:tighthug:
Reply
:iconmermaddy:
Mermaddy Featured By Owner Jul 15, 2014  Professional Digital Artist
How can I apply social icons that have rollover effects into my journal? Is this even possible?
Reply
:icongasara:
Gasara Featured By Owner Jul 16, 2014
Hi there! 
Yes, you can add rollover effects to journal skins. It's a bit tricky to explain in a comment so I found this tutorial for you: www.gadgetronicx.com/2014/05/s…

You'll have to either make your own skin or edit an existing one with the code. You should be able to find some pretty good tutorials on dA if you need help with this.

Hope that helps!
Reply
:iconmermaddy:
Mermaddy Featured By Owner Jul 16, 2014  Professional Digital Artist
Thank you so much! I really appreciate it!
Reply
:iconxbeautifuldreamerx:
xBeautifulDreamerx Featured By Owner Jul 14, 2014  Hobbyist General Artist
I'm so sorry if this is a stupid question, but how do you make the backdrop image repeat?
Reply
:icongasara:
Gasara Featured By Owner Jul 16, 2014
Hi!
Ah, don't worry, no question is stupid. :D

You can't really repeat images with this code. What you have to do is make sure your background is as long as you need it to be. I typically make my backgrounds around 1200x3000px, which is usually long enough for my content. If you're using a background that's not long enough then you can simply edit it and make it a longer image. 
Reply
:iconxbeautifuldreamerx:
xBeautifulDreamerx Featured By Owner Jul 21, 2014  Hobbyist General Artist
Thank you so much for your help! I'll play around with my images a little more to try and make them fit. I actually only realized that the size was a problem because I decided to look at my page on an iPad and everything looked crazy. ^^; 

Thanks again, I really appreciate you taking the time to reply. :D 
Reply
:icongasara:
Gasara Featured By Owner Jul 23, 2014
Actually, after playing around with the codes a bit I found out that you can repeat images - sort of. It's not the best solution either but it does work.
FAQ11 - How do I repeat my custom background?

No problem. Thanks for giving me the opportunity to look into this a little more! :hug:
Reply
:iconfelizias:
Felizias Featured By Owner Jul 15, 2014  Hobbyist Digital Artist
I'd like to know that too. :lol: I've tried some CSS but it didn't work. ^^;
Reply
:iconindustrielluberalle:
industrielluberalle Featured By Owner Jul 11, 2014  Hobbyist Traditional Artist
thank you so much for this
Reply
:icongasara:
Gasara Featured By Owner Jul 12, 2014
You're welcome, my dear!
Reply
:iconstylishgamer:
stylishGamer Featured By Owner Jun 18, 2014
Super helpful, thank you~!
But I just got my premium today, and I was wondering if you can resize images
on your page, or do you have to resize it from the program you used (Paint Tool
SAI, CS6, etc)?
Reply
:iconskoryx:
Skoryx Featured By Owner Jun 8, 2014  Hobbyist Digital Artist
Very helpful. Thank you so much!
Reply
:iconsplat-attack:
Splat-Attack Featured By Owner May 14, 2014  Hobbyist General Artist
Is this now out of date? I cannot seem to pull up a background for my box
Reply
:iconx-paintedlynx:
x-PaintedLynx Featured By Owner May 16, 2014  Student Digital Artist
No, it's not. Are you sure you put in the image URL in the code?
Reply
:iconsplat-attack:
Splat-Attack Featured By Owner May 16, 2014  Hobbyist General Artist
I was putting in the wrong URL lol!
Reply
:iconx-paintedlynx:
x-PaintedLynx Featured By Owner May 17, 2014  Student Digital Artist
Hehe. ^^; don't worry.. It happens to me, too.
Reply
Add a Comment:
 
×
Download PNG 600 × 14640




Details

Submitted on
August 26, 2013
Image Size
1.9 MB
Resolution
600×14640
Link
Thumb
Embed

Stats

Views
32,670 (28 today)
Favourites
2,933 (who?)
Comments
195
Downloads
475 (1 today)
×