Thursday, December 19, 2013

How to add a new content page and link it to a new menu tab in OpenCart

1) Login to your OpenCart admin panel. In your browser address bar type http://yourdomain.com/admin. If you have installed your Opencart under a subfolder “store” for an example the above URL will change to http://yourdomain.com/store/admin

Login using your username and password.


2) Navigate to Catalog > Information


opencart_add_page_1


3) Click Insert button to add a new content page


opencart_add_page_2


4) Type in name of your page and insert text of the page to Description field. You can use visual editor to format your text, insert images and create hyperlinks. You can also edit HTML code. Just click on Source button.


opencart_add_page_3


5) Select Data tab. Here you can define page keywords, set Sort Order and enable or disable the page.


opencart_add_page_4


6) Save the changes and check your store online. Content pages are dislaying in information block.


opencart_add_page_5


7) We should get the URL to our content page to link it to the top menu. Click on a page link in Information block and copy the URL from the address bar of your web browser.


opencart_add_page_6


8) Edit the code of the header.tpl file to add our content page to top menu. The file is located in /catalog/view/theme/themeXXX/template/common

folder


9) Edit the file using any PHP/Code editor. Search for the menu lines. They should look similar to the following.



<ul class="links">
<li class="m1"><a href="<?php echo $home; ?>"><?php echo $text_home; ?><strong></strong></a></li>
<li class="m2"><a href="<?php echo $wishlist; ?>" id="wishlist-total"><?php echo $text_wishlist; ?><strong></strong></a></li>
<li class="m3"><a href="<?php echo $account; ?>"><?php echo $text_account; ?><strong></strong></a></li>
<li class="m4"><a href="<?php echo $shopping_cart; ?>"><?php echo $text_shopcart; ?><strong></strong></a></li>
<li class="m5 last"><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?><strong></strong></a></li>
</ul>

 



NOTE: The code may vary depending on the template


10) Each line of code is displaying one menu element. Copy the last line of code:



<li class="m5 last"><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?><strong></strong></a></li>

 



Add a new line and paste the code you have copied


11) Class last should be assigned to the last menu element. We are adding our Test page as the last one. So we should remove last class from the previous menu element


Change the following code:








1



<?php echo $checkout; ?>




To the URL to our content page we have copied earlier


The following code








1



<?php echo $text_checkout; ?>




should be changed to the title of the menu element.


12) Here is the complete line with the changes we have applied:



<li class="m6 last"><a href="http://templatetesting.com/ron/opencart/index.php?route=information/information&information_id=8">Test<strong></strong></a></li>

 



13) And the complete menu code block:



<ul class="links">

<li class="m1"><a href="<?php echo $home; ?>"><?php echo $text_home; ?><strong></strong></a></li>
<li class="m2"><a href="<?php echo $wishlist; ?>" id="wishlist-total"><?php echo $text_wishlist; ?><strong></strong></a></li>
<li class="m3"><a href="<?php echo $account; ?>"><?php echo $text_account; ?><strong></strong></a></li>
<li class="m4"><a href="<?php echo $shopping_cart; ?>"><?php echo $text_shopcart; ?><strong></strong></a></li>
<li class="m5"><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?><strong></strong></a></li>
<li class="m6 last"><a href="http://templatetesting.com/ron/opencart/index.php?route=information/information&information_id=8">Test<strong></strong></a></li>

</ul>

 



14) Save the file. The page has been added to the menu.



How to add a new content page and link it to a new menu tab in OpenCart

No comments:

Post a Comment