Shop More Submit  Join Login
×




Details

Submitted on
September 25, 2013
File Size
1.0 KB
Link
Thumb
Embed

Stats

Views
7,733 (1 today)
Favourites
586 (who?)
Comments
49
Installs
1,391
×
Code Snippet - 2 Column Menu by Gasara Code Snippet - 2 Column Menu by Gasara
09.10.2013 - Updated to remove dA's new default external link styles.

Here we have a template for a simple 2 column navigation menu. The menu has been designed to work on profile pages but can be added to full journal css too. Please see below for help with using this code snippet.

I N F O
--------------------------------------------------

Width: Liquid
Customizable: Yes
Tested in IE, Chrome & Firefox

Custom journal skins can only be used by premium members.

H E L P
--------------------------------------------------

Click the Install button in the sidebar to add the skin to your gallery. The links below will provide further help with adding the skin to a widget on your profile page and changing the style of the menu.

FAQ12 - How do I add a custom menu?
FAQ22 - How do I install a journal skin?
FAQ23 - How do I change my journal skin?
FAQ24 - How do I edit my journal skin?

Basic HTML Formatting Guide
Basic CSS Style Guide


U S A G E
--------------------------------------------------

- This skin is free to use
- You can completely edit this skin for personal use
- You can use this skin on your profile
- You can add this code to existing or new journal CSS

- You may not redistribute this skin, edited or otherwise
- You may not sell this skin, edited or otherwise
Add a Comment:
 
:iconcarapherneiia:
CarapherneIia Featured By Owner Aug 29, 2014  Hobbyist Digital Artist
How do I get them to act as buttons, to lead where I would like them to go?
Reply
:icongasara:
Gasara Featured By Owner Aug 29, 2014
Once you've installed the skin to your journal, go into the editing section. You need to add the URL of the page you want to link to as well as change the link text. Look for the following section of code:

<a class="menu" href="">Link</a>

Add the URL inbetween the quote marks after href= and replace Link with the text you want to become clickable. For example:

<a class="menu" href="http//www.mylink.com">My Button Name</a>

The following should help you out.

FAQ22 - How do I install a journal skin?
FAQ23 - How do I change my journal skin?
FAQ24 - How do I edit my journal skin?
FAQ16 - How do I create a text link?
FAQ21 - How do I find a page URL?
Reply
:iconcarapherneiia:
CarapherneIia Featured By Owner Aug 23, 2014  Hobbyist Digital Artist
Hi, so I was wondering, I changed the number of buttons to 3, but what would I do to get them to go side by side?
Reply
:icongasara:
Gasara Featured By Owner Sep 7, 2014
Do you mean so it looks something like this?

| link | link | link |
Reply
:iconcarapherneiia:
CarapherneIia Featured By Owner Sep 7, 2014  Hobbyist Digital Artist
yeah that's what i mean
i changed it so I only have 3 buttons but I'm not sure how to get them side by side...?
Reply
:icongasara:
Gasara Featured By Owner Sep 7, 2014
Okey-dokey. In the Skin CSS section change the width size of the columns by setting the width to 33% instead of 50%. Your code for this should look as follows.

.col {
display: table-cell;  
width: 33%;
}

Then delete everything from the Skin Header section and copy/paste in the following. This will give you three buttons in a row.

<div class="menu"><div class="table"><div class="col"><a class="menu" href="">Link</a></div><div class="col"><a class="menu" href="">Link</a></div><div class="col"><a class="menu" href="">Link</a></div></div></div>

Add in your link URLs and text and save!

If there's anything else you need, just let me know.
Reply
Hidden by Commenter
:iconhoiiister:
hoIIister Featured By Owner Jul 25, 2014  Hobbyist Digital Artist
where can I find buttons like these that go into the custom box?
Reply
:icongasara:
Gasara Featured By Owner Jul 25, 2014
You can't find buttons exactly like these but there are similar ones you can use. CypherVisor has some great tutorials in his gallery that should help you out.
Reply
:iconhoiiister:
hoIIister Featured By Owner Jul 25, 2014  Hobbyist Digital Artist
yes you can ? He just sent me the link to them
Reply
Add a Comment: