Shop More Submit  Join Login
×




Details

Submitted on
July 31, 2013
Image Size
17.5 KB
Resolution
400×817
Link
Thumb
Embed

Stats

Views
2,956 (1 today)
Favourites
212 (who?)
Comments
38
Downloads
4
×
Page Menu by PizzaPotatoNBacon Page Menu by PizzaPotatoNBacon

:star: Can be used by all! :star:



For Premium Members and Super Groups: Paste the code below on any widget you desire to put it on. :flirt:

For Regular Members: Paste the code into one of default widgets/ widgets available to all users. Widgets such as your deviantID, Featured Deviation, Newest Deviations, etc.


Hello, everyone! :wave: I have something new for you guys to use on your profiles! :la:

I present to you all, a new kind of menu! :w00t: Now, you can have much more fancier menus on your profile- hover over an item, and you'll see why! :dummy: You can also "highlight" a certain item, as if it was "selected". :eyes:

Of course, you can't customize the colors, and you can make much more advanced and fancier page menus with a certain technique (I suggest :+devwatch:ing `CypherVisor for a tutorial on this technique ;)), but said technique requires a lot more skill and tinkering. :P :cough: In other words, you need at least basic knowledge of Journal CSS to be able to make yourself a fancier menu than the one offered here. :hmm:



The Code:



<div class="gallery-categories browse-facet">
<ul>
<li><a href="" class="selected">Highlighted Item</a></li>
<li><a href="">Item</a></li>
<li><a href="">Item</a></li>
</ul>
<div class="noncollapseHeader"><b>Header Here</b></div>
<ul>
<li><a href="">Item</a></li>
<li><a href="">Item</a></li>
<li><a href="">Item</a></li>
<li><a href="">Item</a></li>
</ul>
</div>

:bulletgreen: There is no limit to the amount of list items you can use. :D Don't use more than you need, though! ;)
:bulletgreen: If you want more headers, add another "<div class="noncollapseHeader"><b>Header Here</b></div>" in between lists! :la:
:bulletgreen: If you want to separate lists, make sure to end it with a "</ul>". :nod:
:bulletgreen: There is no limit to the amount of list items you can "highlight!" :) To highlight a list item, add "class="selected"" to "<a href="">". Example: <a href="" class="selected">List Item to be highlighted

If you have any questions, feel free to ask me! :w00t:



Tumblr | Twitter | My gallery



This Custom Box Resource is free to use for all. :aww:

Posted on July 31, 2013 9:08 PM PHT.

Resource provided by Me, `fluf-studios, Alex R.
Add a Comment:
 
:icontmntiluvpizza:
TMNTiluvpizza Featured By Owner Jun 24, 2014  Student General Artist
can you explain how to add links?... 
Reply
:iconpizzapotatonbacon:
PizzaPotatoNBacon Featured By Owner Jun 25, 2014  Student General Artist
See the "<a href="">Item</a>"'s in the description? Put your link between the quotes (<a href="LINK"></a>). :D
Reply
:icontmntiluvpizza:
TMNTiluvpizza Featured By Owner Jun 25, 2014  Student General Artist
Thank you!
Reply
:iconladny:
ladny Featured By Owner Jun 4, 2014
This may be a stupid question but could the menu also collapse? ;w;  Like if you hover over the heading and a drop down kind of menu?
Reply
:iconpizzapotatonbacon:
PizzaPotatoNBacon Featured By Owner Jun 4, 2014  Student General Artist
I'm afraid not. :no: That requires another good amount of coding, and this was plucked out of dA's own code. =P (And don't worry, that was not a stupid question at all. :icontouchplz:)
Reply
:iconpachisu:
pachisu Featured By Owner Jan 26, 2014
Love this tutorial!
I was wondering if it was possible to show an image on the side after hovering over a text/link (or maybe even another image @__@ )?
Reply
:iconmichiyo--chan:
Michiyo--Chan Featured By Owner Dec 8, 2013  Hobbyist Digital Artist
This is very useful! Thank you! ;v;
Reply
:iconpizzapotatonbacon:
PizzaPotatoNBacon Featured By Owner Dec 8, 2013  Student General Artist
Thanks. :hug: Glad you like it. :D
Reply
:icondaniaarts:
DaniaArts Featured By Owner Sep 25, 2013   Digital Artist
Thank you :heart:
Reply
:iconpizzapotatonbacon:
PizzaPotatoNBacon Featured By Owner Sep 27, 2013  Student General Artist
:huggle:
Reply
Add a Comment: