HOME | DD
CypherVisor β Profile Navigation Menu tutorial
by-nc-nd
Published: 2013-08-05 16:54:07 +0000 UTC; Views: 40514; Favourites: 1172; Downloads: 0
Redirect to original
Description
LAST UPDATED: 22-Feb-2014The long awaited super secret customization tutorial is here today!
Lot of deviants have asked me for this tutorial and so here you go. I have kept it a secret for a long time now and finally releasing it to public. Not to deny that some of them did figure this out on their own and successfully customized their own profile widgets. Kudos to those who did!
Critiques are welcome
LIVE VIEW: CypherVisor
Journal used in this tutorial: Link
Custom background code and tutorial: Link
Other tutorials:
Want to customize your profile more?
Check all my free resources + tutorials: cyphervisor.deviantart.com/galβ¦
Having any doubt with Custombox or Journal CSS? 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 send me a note for more details
Related content
Comments: 297
how would I do this now? Since you can't put journal deviations as a Featured deviation. Please help
π: 0 β©: 0
Where can I find how to ACTUALLY learn how to code a custom menu box? All that is shown within this journal is how to submit one with a custom background/journal skin instead of actually showing a tutorial for the custom box itself with some added self advertisement. Please do change the title as its very missleading to what is actualy shown.
π: 0 β©: 0
How do I add a background to feature widget?
I have a feature widget that has one but now when
I try to do it with another menu the background
covers it.
What am I doing wrong?
π: 0 β©: 1
i'm having the same issue, i know your comment was a few months ago but did you figure it out ;;
π: 0 β©: 1
You might have the in the wrong place?
π: 0 β©: 0
help >.<
when I try to put the code into the literature deviation and feature it, it just comes up as a bunch of words, no buttons ;-;
π: 0 β©: 1
soory, but you need to be a core member in order to do codes ;;
π: 0 β©: 1
aww alright ;A;
I've seen some non core members having code on their page...did they get to retain their core membership code privileges?
π: 0 β©: 1
there's some HTML you can do without any membership...
for example, you can do < b > for bold
< i > for italics
< sub > for sub text
if you mean the navigation thingies like, for example, on my page, you can do that without any membership, but you need to do the navigation when you previously have membership ;;
i hope you get what i'm saying? XD I suck at explaining lol
π: 0 β©: 1
ohhh i see
well hoprfully i'll manage to get membership for a couple days ans i canΒ try doing that
π: 0 β©: 0
May I get help from here?
I have done everything like it says in every tutorial I've checked, but still, I can't get the right categories to shown. It only gives my journal categories and because of that I can't use it as my profile directory. I have done this over 10 times now and still I am not getting the right result. After watching the video tutorial I noticed that when your saved directory says "Submitted with: Sta.sh" mine says "Submitted with: Sta.sh writer"
I really don't know what is going on!
π: 0 β©: 1
the submit button should be at the top right of your sta.sh page, try clicking that!
π: 0 β©: 0
Everything works perfectly, this was really helpful!
The only thing is that I'm trying to add stamps below my menu, and everything shows until I add the background in the widget, then the menu shows but the stamps don't. I tried to change the z-index but it still doesn't show the stamps, only the menu.
Navigation
Any idea on how to fix it? :/
π: 0 β©: 1
Sorry if I bother you, but, can you tell me how did you do the Navigation Menu, please? I tried, but I still lost :c
π: 0 β©: 0
Ah, problem 
π: 0 β©: 1
same as you ! : O
π: 0 β©: 1
Try adding the background straight into the deviation, instead of using a widget background. I haven't tried it myself yet so I don't know if the background will fill the box, but I suspect it will
π: 0 β©: 1
I found the solution ! you have to use a z-index in the css of your deviation ! 
But thank you for your answer !
π: 0 β©: 2
YAS! thanks for Finding this, I was trying for hours before I found your comment : D
π: 0 β©: 1
z-index? o_O What's that? Sorry, I'm a noob here.
I just put a normal background on with background-image, but the display on my profile still has green borders because the whole widget isn't taken up by the deviation display. Grrr dammit this is hard. Does your solution mean you can add a background to the widget without it covering the deviation?
π: 0 β©: 1
well, all the advices are there :Β
and the z-index thing is there :Β developer.mozilla.org/en-US/doβ¦
Hope it helped ^^you better have some basics before starting it. ^^
π: 0 β©: 1
Ah, awesome it fixes the problem. Thanks genius!
π: 0 β©: 1
I really would like this on my page ; . ; but i dont understand it > -< please can you help meeeehhh. i know you prob have alot on Β your plate c; but it would mean alot if you could spare me some of your time <3 when you have the chanceΒ
π: 0 β©: 0
I made my buttons, aded to DA but when I put links into it it crashes and looks awful. How to do this codes? can u upload tutorial about that? how to make it work
π: 0 β©: 0
Hello! May I get a commission for a navigation menu?Β
π: 0 β©: 0
Btw, first thing you need is to be a premium member.
π: 0 β©: 1
Ahahaha I am, I nailed it, thank you for the tutorial c:
π: 0 β©: 1
But... it isnΒ΄t easier to not put a background color on the skin instead of wasting time making it exactly like the widget background? Worked for me.
π: 0 β©: 1
You can simply have a transparent background color for your skin and that way your widget background will be visible directly without any hassle.
π: 0 β©: 0
Whenever I add a bg image, it pops OVER it and hides my navigation menu. Please help
UPDATE: Nvm, It's fixed. I forgot to add "position:relative" in the container box
π: 0 β©: 1
Mine keeps messing up
everytime i put the background on, it takes away half of the items on my widget
sta.sh/01hzwsc5tif2
I i put the Z-index at 1000 but it still doesn't work
π: 0 β©: 1
You need to put z-index in all the skin classes that you want to be above the background.
π: 0 β©: 0
Instead of clicking onΒ the "My Journal" category, you click on these categories: Literature>Characters & Settings>Profiles.
Then submit it, and KA-BLAM! Set it as a featured deviation :3 If you need any more help, just let me know c:
Hope this helped xD I figured this out by looking at some other tutorial.
π: 0 β©: 1
Ah! I see... That's a nice tip. Thanks
And sure, if you have anything new to share please do. I am always open to learn.
π: 0 β©: 0
Hello!
Above, it said deviantART now denies the allowance of having journals on "Featured deviation".
So what am I supposed to do next, since part of tutorial is required journals? I'm very nooby at codes. >.<
Thanks! And very nice tutorial!
π: 0 β©: 2
Yes, to actually create the profile menus you need complete CSS knowledge to code skins.
π: 0 β©: 0
Hi. I'm sorry that no one replied to you ;u; I figured out how to, though.
Instead of clicking onΒ the "My Journal" category, you click on these categories: Literature>Characters & Settings>Profiles.
Then submit it, and KA-BLAM! Set it as featured :3 If you need any more help, just let me know c:
π: 0 β©: 1
Thanks! 
π: 0 β©: 1
You're welcome! I'm glad that it did c:
π: 0 β©: 1
| Next =>