Many users of my template asked about how to make Sub title or children link in My template conversion. This article will explain about how to make category link in my works. And, this is only capable for template that designed by Jinsona Design, (except Gamezine...).
Before start, let us imagine about simple classification logic. Please see the screenshot below.


Ok.... First picture tell us about covered area. The Red is the biggest, it cover the blue and green color area. While the blue is the second biggest. And so on.
While, The second picture is telling us about the structure. A is the biggest class. A1, A2, A3, A4 are the second class. A1a, A1b, and etc are the smallest.
To make the sublink, The principle is the same with the classification in the screenshot above. Yes, so simple, right.
Now, Let's begin.
Here is the HTML Structure of Sub-link or children.
<li><a href="PARENT-LINK-ADDRESS">PARENT TITLE</a>
<ul class="children">
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="SUB-PARENT-LINK-ADDRESS">SUB PARENT TITLE</a>
<ul class="children">
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<!-- You could add more list by copy-paste the green text in here -->
</ul>
</li>
<!-- You could add more list by copy-paste in here -->
</ul>
<!-- You could add more list by copy-paste here -->
</li>
Note 1:
The red Color is the largest / biggest class
The Blue color is the second largest class
The Green Color is the smallest class
Note 2:
Change the word below with website address or URL
CHILDREN-LINK-ADDRESS
CHILDREN-LINK-ADDRESS
SUB-PARENT-LINK-ADDRESS
PARENT-LINK-ADDRESS
Also, Change the word below with your link title:
CHILDREN TITLE
SUB PARENT TITLE
PARENT TITLE

Before start, let us imagine about simple classification logic. Please see the screenshot below.

Ok.... First picture tell us about covered area. The Red is the biggest, it cover the blue and green color area. While the blue is the second biggest. And so on.
While, The second picture is telling us about the structure. A is the biggest class. A1, A2, A3, A4 are the second class. A1a, A1b, and etc are the smallest.
To make the sublink, The principle is the same with the classification in the screenshot above. Yes, so simple, right.
Now, Let's begin.
Here is the HTML Structure of Sub-link or children.
<li><a href="PARENT-LINK-ADDRESS">PARENT TITLE</a>
<ul class="children">
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="SUB-PARENT-LINK-ADDRESS">SUB PARENT TITLE</a>
<ul class="children">
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<li><a href="CHILDREN-LINK-ADDRESS">CHILDREN TITLE</a></li>
<!-- You could add more list by copy-paste the green text in here -->
</ul>
</li>
<!-- You could add more list by copy-paste in here -->
</ul>
<!-- You could add more list by copy-paste here -->
</li>
Note 1:
The red Color is the largest / biggest class
The Blue color is the second largest class
The Green Color is the smallest class
Note 2:
Change the word below with website address or URL
CHILDREN-LINK-ADDRESS
CHILDREN-LINK-ADDRESS
SUB-PARENT-LINK-ADDRESS
PARENT-LINK-ADDRESS
Also, Change the word below with your link title:
CHILDREN TITLE
SUB PARENT TITLE
PARENT TITLE


9 comments:
Thank's!!!
HOW CAN I MAKE TO GAMEZINE PLS THANKS !!!
@free2watch; I have write about it. please follow the instruction page in gamezine category menu article
Can I get the preview from finished category menu???
.thanks.
its not work in my mobipress theme, plase recheck it! http://symaks.blogspot.com/
@wongpolos; please check again!
where should i put the html
i search it on edit html
but not found :(
is there a way to make it like this?
A
A1
A1a
A1a1
A1a2
A1a3
A1b
A1c
A2
A3
i want to make
A
A1a
A1b
A1c
A1d
A1e
A1f
and more, to make a menu of game categories, example:
Categories
Shoot
Race
Simulator
and etc, to my website, please help-me
Post a Comment