Homepage and Navigation Menu's Help

[Guest iNC Design]

Hey all,

First impressions of CC5 is that it's a huge improvement, but I was hoping slightly more autonomy would have been given to the skin, I am basically looking for a way of adding more than one Navigation menu to a skin and creating a different home page.

For example at present there is just main.php in the skin which controls how the entire skin looks but how do I tell it that I want a slightly different layout on the actual homepage? ie. I want a single column home page, but would like a 3 column site.

Secondly I want to add an additional navigation menu as you do with {$CATEGORIES}, which is then controlled in the skin via box.navigation.php and element.navigation_tree.php, which is cool, and works well in the 3 column layout, but I'd like to add a horizontal category menu (with popup/dropdown submenus), but cannot find a way of utilising the underlying functions and just creating a new instance with new formatting information in the common.css.

It could be that I am just being stupid, that happens, according to the mrs more often than I care to admit

gui.class.php contains the container for {$NAVIGATION} but how do I get to it from the skin so I can create multiple instances of menu's.

I think it might have been an idea to have released SOME documentation around the new framework so we didn't have to disect code to try and work out what the hell is going on before hand, even if it was a paid for subscription such as MSDN, ADN, and so on. It would definitely increase the speed and yield of modules, plugins and skins, in turn making CC5 even more viable.

Thanks for any and all help.

D.

---

I mean without altering the core code of that CC system, I see I can add an extension class inside CC, but obviously I would prefer to make it completely sub-system independent and only be contained within the skin files themselves.

Edited June 30, 2011 by iNC Design

[Guest iNC Design]

Hey all,

First impressions of CC5 is that it's a huge improvement, but I was hoping slightly more autonomy would have been given to the skin, I am basically looking for a way of adding more than one Navigation menu to a skin and creating a different home page.

For example at present there is just main.php in the skin which controls how the entire skin looks but how do I tell it that I want a slightly different layout on the actual homepage? ie. I want a single column home page, but would like a 3 column site.

Secondly I want to add an additional navigation menu as you do with {$CATEGORIES}, which is then controlled in the skin via box.navigation.php and element.navigation_tree.php, which is cool, and works well in the 3 column layout, but I'd like to add a horizontal category menu (with popup/dropdown submenus), but cannot find a way of utilising the underlying functions and just creating a new instance with new formatting information in the common.css.

It could be that I am just being stupid, that happens, according to the mrs more often than I care to admit

gui.class.php contains the container for {$NAVIGATION} but how do I get to it from the skin so I can create multiple instances of menu's.

I think it might have been an idea to have released SOME documentation around the new framework so we didn't have to disect code to try and work out what the hell is going on before hand, even if it was a paid for subscription such as MSDN, ADN, and so on. It would definitely increase the speed and yield of modules, plugins and skins, in turn making CC5 even more viable.

Thanks for any and all help.

D.

---

I mean without altering the core code of that CC system, I see I can add an extension class inside CC, but obviously I would prefer to make it completely sub-system independent and only be contained within the skin files themselves.

OK, to move this story on a little, I have now over-ridden the formatting of the menu to create a separate design instance of {$CATEGORIES}

#my_navigation {

  display: block;

  width: 100%;

  height: 30px;

}

#my_navigation ul > li > a {

        float: left;

        font-size: 12px;

        line-height: 30px;

        padding-right: 5px;

        padding-left: 1px;

        border-left: 1px #444 solid;

        test-align: center;

        color: #ccc;

}

Which basically gives a horizontal menu bar just by reassigning the formatting.



I still need to know how to create a different homepage from the rest of the site, I am really struggling on this one, is there a flag for determining whether you are on the homepage, ie 

 isset($homepage) 

?

Thanks for ANY help or pointers here in advance!

D.

[Guest iNC Design]

Ok, so as nobody is replying or even thinking about helping I am just wading my way through the code of everything

trying to work out which was is up. Here's what I've done for the Home page stuff, which I really didn't want to do as

it messes with the core underlying code, but it would seem it wasn't a coded in variable/function from the outset.

File: /classes/gui.class.php

Between

//Assign common GUI parts

$GLOBALS['smarty']->assign('VAL_SELF',          currentPage());

$GLOBALS['smarty']->assign('STORE_URL',         CC_STORE_URL);

$GLOBALS['smarty']->assign('ROOT_PATH',         CC_ROOT_REL);

$GLOBALS['smarty']->assign('CURRENT_PAGE',      currentPage());

and

$GLOBALS['smarty']->assign('SESSION_TOKEN',     $GLOBALS['session']->getToken());

$GLOBALS['smarty']->assign('CATALOGUE_MODE',$GLOBALS['config']->get('config', 'catalogue_mode'));

$GLOBALS['smarty']->assign('CONFIG',$GLOBALS['config']->get('config'));

I have inserted the following Global var $HOME_PAGE

$GLOBALS['smarty']->assign('HOME_PAGE',         CC_STORE_URL . CC_ROOT_REL . "index.php");

I now access this variable in the skin's main.php to determine where I am in relation to the main sites Home Page

using the following conditional check.

{if $HOME_PAGE === $CURRENT_PAGE}

  <insert home page layout here>

{else}

  <put some other layout here>

{/if}

So there you go, now you can have a separate landing page to the main framework with next to no effort, other

than planning the layouts, graphics and so on, as well as using the default layout for whatever skin you happen

to be adopting/using.

So thanks everyone for the help (yes, I am being sarcastic!), I hope at the very least you lot find this useful and

you can adapt it to suit your own purposes (including the formatting over-riding in my previous post).

Peace out!

D.

[Guest hennaboy]

Ahhhh well done. Nice job.

I did mean to post saying I have not found it so do not think it is set but then forgot :P

[Guest koshka]

Thanks you so much for that! I'm still having trouble finding my way around cc5 after so many years of cc3 and 4. I had been trying to work out how to do this but wasn't coming up with anything so I really appreciate your effort :)

[Guest jleonardusa]

Ok, so as nobody is replying or even thinking about helping I am just wading my way through the code of everything

trying to work out which was is up. Here's what I've done for the Home page stuff, which I really didn't want to do as

it messes with the core underlying code, but it would seem it wasn't a coded in variable/function from the outset.

File: /classes/gui.class.php

Between

//Assign common GUI parts

$GLOBALS['smarty']->assign('VAL_SELF',          currentPage());

$GLOBALS['smarty']->assign('STORE_URL',         CC_STORE_URL);

$GLOBALS['smarty']->assign('ROOT_PATH',         CC_ROOT_REL);

$GLOBALS['smarty']->assign('CURRENT_PAGE',      currentPage());

and

$GLOBALS['smarty']->assign('SESSION_TOKEN',     $GLOBALS['session']->getToken());

$GLOBALS['smarty']->assign('CATALOGUE_MODE',$GLOBALS['config']->get('config', 'catalogue_mode'));

$GLOBALS['smarty']->assign('CONFIG',$GLOBALS['config']->get('config'));

I have inserted the following Global var $HOME_PAGE

$GLOBALS['smarty']->assign('HOME_PAGE',         CC_STORE_URL . CC_ROOT_REL . "index.php");

I now access this variable in the skin's main.php to determine where I am in relation to the main sites Home Page

using the following conditional check.

{if $HOME_PAGE === $CURRENT_PAGE}

  <insert home page layout here>

{else}

  <put some other layout here>

{/if}

So there you go, now you can have a separate landing page to the main framework with next to no effort, other

than planning the layouts, graphics and so on, as well as using the default layout for whatever skin you happen

to be adopting/using.

So thanks everyone for the help (yes, I am being sarcastic!), I hope at the very least you lot find this useful and

you can adapt it to suit your own purposes (including the formatting over-riding in my previous post).

Peace out!

D.

Thanks for taking the lead on this and posting your solution. I will have to dive into this shortly also, and its one of the first things Ill have to do. I also dont get why there's no easy way to do it in CC5. Its pretty standard for the majority of websites to have a landing page with different content to the site catalog these days, and I thought it was put in as a request to the team for inclusion in 5 (I dont remember for sure - but I thought it was).

Im also a bit disappointed at the complete lack of any support documentation outside of install instructions. Surely it would make sense to release with some, even minimal docs? And even still, over 3 weeks later and there still is nothing. Makes life extremely hard for those who have to start from scratch and are not code monkeys.

CC5 does look good though - a huge leap in the terms of look and functionality, and congrats to the team for its completion. There doesnt seem to be many major bugs which is good.

(Sort of) looking forward to digging in and rebuilding our site in 5!

[Guest iNC Design]

Thanks for taking the lead on this and posting your solution. I will have to dive into this shortly also, and its one of the first things Ill have to do. I also dont get why there's no easy way to do it in CC5. Its pretty standard for the majority of websites to have a landing page with different content to the site catalog these days, and I thought it was put in as a request to the team for inclusion in 5 (I dont remember for sure - but I thought it was).

Im also a bit disappointed at the complete lack of any support documentation outside of install instructions. Surely it would make sense to release with some, even minimal docs? And even still, over 3 weeks later and there still is nothing. Makes life extremely hard for those who have to start from scratch and are not code monkeys.

CC5 does look good though - a huge leap in the terms of look and functionality, and congrats to the team for its completion. There doesnt seem to be many major bugs which is good.

(Sort of) looking forward to digging in and rebuilding our site in 5!

Depending on the Skin which they have shipped with v5, there is a separate content.homepage.php, which is exactly was it says on the tin. However

that doesn't allow you to completely change your frontend layout, it just allows you to put different content in at that given point (ie. latest products etc).

What I wanted was to go from a non-variable fixed layout homepage, a single column with information, links and sales material, to a completely fluid

two column (usual CC skin) type affair. The content.homepage.php does not cater for that scenario. And for the sake of one line of code within the

core system I think it's pretty lazy not to put it in. But hey ho, done now, and posted here so everyone else can make the adjustment. Hopefully the

CC team will adopt the extra line and make it a standard variable in 5.0.1 whenever that is due out.

I am by no means an expert at this sort of thing, hence I look to people like CC to provide me the shell in which people can then "template" for their

own needs. I certainly did not expect this much trouble or realise my depth of knowledge would need to increase exponentially.

I also find it VERY irritating that you can no longer use <?php .. ?> inside the skin, the entire skin is now effectively parsed and it treats inline PHP

as just text. I'm not sure why this approach was taken, but hopefully it was a good reason.

Don't get me wrong, I am not being negative about CC5, it seems a far more stable product, but the lack of "templating/white-labelling" documentation

is ridiculous. What should take a couple of days reading time, is now a whole couple of weeks just working out what the hell is going on and what

variables are available to test.

I would suggest, now CC5 is here, someone should be dedicated to answering peoples questions, and writing up the responses somewhere, tha

way at least owners of the system can view an organic, ever increasing documentation set.

D.

[Guest KatGirl]

Hi iNC Design

Thanks for your post. It's the one thing I've been struggling with for the last two weeks - figuring out how to provide a separate landing page for my store. I've searched every file with CC5 looking for the instance where main.php was called so I could (again) figure out how to call a separate home page. .

Anyway, I've added that one line to my classes/gui.class.php file and then pasted your conditional code into my skins template main.php file but I cannot seem to get it to work.

Can you tell me where about in main.php you popped your code to call an independent landing page for index.php, and using the [else] statement use the default skin 'layout' and template systems for all other pages?

I've tried just about every variation within main.php without results.

Thanks heaps

Kate

[Homar]

It should be possible to use alternate templates for separate sections of the store without modifying the CubeCart classes. Smarty allows for the inclusion of additional template files. This allows you to render alternate templates from the main.php file - e.g:

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.alternate.php"}

Note that the scope is set to "parent" so that all the SMARTY variables accessible in the main.php file are also accessible in the main.alternate.php template file. You now only need some logic to differentiate between pages (e.g. homepage, product pages, category pages, etc). You can do this by testing for the existence of specific variables that are only accessible to certain areas of the store. You can add {debug} to the main.php template file to bring up the smarty debug console. This will present you with all the variables available to the current page and should assist in selecting suitable variables to test for. As an example, you might do {if isset($PRODUCT)} to test if a product page is being viewed.

This would certainly be cleaner if a variable was made available that denoted the page being viewed (e.g. {if $PAGE == "home"}). Perhaps that's a feature request for the bug tracker.

So... your main.php file might look like this:

{if isset($PRODUCT)}

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.alternate.php"}

{else}

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.normal.php"}

{/if}

You would then place all the usual HTML markup inside of main.normal.php and main.alternate.php.

Really do avoid modifying any core PHP files. There is rarely any need and it will make updates a painful process. You can create a small plugin instead and upload it to CCF.org for the whole community.

[Guest KatGirl]

It should be possible to use alternate templates for separate sections of the store without modifying the CubeCart classes. Smarty allows for the inclusion of additional template files. This allows you to render alternate templates from the main.php file - e.g:

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.alternate.php"}

Excellent! With sharing information like this people will know how to modify the look of their store. Unfortunately, without your post I did not know this was even possible. Sure, I read up on Smarty via their website because I like to know how things work, but they are using tpl template files and CubeCart uses php template files so it becomes confusion city trying to understand how SMARTY relates to CUBECART. In the end I gave up

This clarification of yours will be extremely useful for anyone who uses CC5.

Note that the scope is set to "parent" so that all the SMARTY variables accessible in the main.php file are also accessible in the main.alternate.php template file.

Again, good to know!

You now only need some logic to differentiate between pages (e.g. homepage, product pages, category pages, etc).

When you say "some logic" I'm assuming as outlined below?

I find that extremely cumbersome to operate. Having to explicitly 'set' what variables I want to display on any given page will become a bit of a nightmare. What if I want the following:

This is an extreme example, but hey - some people are extreme.

Products >> Related Products >> Popular Products all on the one page - not including whats in the sidebar.

Does my code then look like this:

{if isset($PRODUCT && $RELATED_PRODUCTS && $POPULAR_PRODUCTS)}

You can do this by testing for the existence of specific variables that are only accessible to certain areas of the store. You can add {debug} to the main.php template file to bring up the smarty debug console.

Okay. How exactly do you bring up the smarty debug console? What do I click? Where do I click?

This will present you with all the variables available to the current page and should assist in selecting suitable variables to test for. As an example, you might do {if isset($PRODUCT)} to test if a product page is being viewed.

This would certainly be cleaner if a variable was made available that denoted the page being viewed (e.g. {if $PAGE == "home"}). Perhaps that's a feature request for the bug tracker.

Yep, Anything that makes using CC easy is my goal.

So... your main.php file might look like this:

{if isset($PRODUCT)}

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.alternate.php"}

{else}

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.normal.php"}

{/if}

You would then place all the usual HTML markup inside of main.normal.php and main.alternate.php.

Okay. Looks simple enough BUT....

Where do you place this code? Before the HEAD section? Before the BODY section. In the BODY section?

Homar, I'm assuming that I would copy the main.php file in its entirety and rename it main.normal.php so the store can run as per usual. I'm also assuming, based on your example code, that in situations where PRODUCTS are not shown (ie: login page, registration page, gateway page, etc...) that main.normal.php will kick into gear and display properly. Right?

In all instances where PRODUCTS are used - home page, category pages, single product pages, the main.alternate.php will only display. Is this correct?

Without diminishing your help, it would be so much easier if we could do this: within the skins's main.php template file, inside BODY tags.

{if $PAGE == ("home")}

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.homepage.php"}

{else}

{include scope=parent file="skins/$SKIN_FOLDER/templates/main.php"}

{/if}

Its introducing one new template file and we're done. Easy.

Really do avoid modifying any core PHP files. There is rarely any need and it will make updates a painful process. You can create a small plugin instead and upload it to CCF.org for the whole community.

I understand what you are saying and I am most reluctant to modify core files, particularly with looming upgrades on the horizon, however, when there is a lack of 'how tos' it makes it exceedingly difficult for people to get on with running their business. If they have to spend their every waking moment hunting down information just so they can tweak the look of their store, they are no longer business owners. Instead they become frustrated researchers.

Thanks for your help, Homar. It's appreciated. :D

[Homar]

Woah. Ok. Let me try to clarify.

The logic is used to decide which template file to render. We might envisage two main template files. In my example, I called them main.normal.php and main.alternate.php, but they could be called anything. One might have a one column layout whilst the other might have a two column layout. They would essentially contain all the code that you would normally put in the main.php template file. The main.php template file is then only used to select between these two template files. To select one or the other, some logic is required (as described earlier). The real problem is that CC5 does not make it easy to distinguish what area of the site is being viewed. As such, I suggested identifying variables that are only present on certain pages or areas of the site. As an example, the $PRODUCT variable might be available to only the product page. We could then test for whether this variable exists as part of our logic and subsequently decide to render a different template file. If you want to render a different template file for the homepage, you will need to identify a variable that is only set on the homepage (perhaps $LATEST_PRODUCTS).

Naturally, this would be far easier if a single variable were available that indicated the page being viewed.

Instead of having to identify variables that are only set on certain pages, it should be fairly easy to create a small plugin that provides this single variable (mentioned above).

With regards to "Products >> Related Products >> Popular Products all on the one page". I'm not sure exactly what you're trying to achieve. The main.normal.php and main.alternate.php files would act exactly like an original main.php file. In other words, you can choose what to display in each one. However, you are limited to the variables that are passed to the main.php file. You cannot, for instance, have your popular products markup in these files. You only have access to the $POPULAR_PRODUCTS variable, which contains the markup from the rendered box.popular.php file. If you did want to have different markup for the popular products depending on what page is being viewed, you would need to repeat the procedure for the box.popular.php template file (i.e. creating box.popular.normal.php and box.popular.alternate.php and then implementing some logic to select between the two inside of box.popular.php). In summary, using smarty's {include} is, for most intents and purposes, the same as using PHP's include construct (http://www.smarty.net/docsv2/en/language.function.include.tpl).

Smarty has a debug console, which is different from CubeCart's debug output. You can run Smarty's debug console by adding {debug} to your main.php template file. When you reload the page, you should be greeted by a popup that lists all the variable available to the current page. I just suggested using this for identifying which variables could be used to distinguish between which page is currently being displayed.

The example code provided would be inserted inside of the main.php file. It could be the only code in the main.php file. All the usual page markup (<head>, <body>, etc.) would be in the main.normal.php and main.alternate.php template files. But it's entirely up to you what code you put where. You could, for instance, include markup that is common amongst both template files inside of the main.php file. This might then look like:

MAIN.PHP:

<html>

<head>...</head>

<body>

<div id="page">

{if isset($PRODUCT)}

    {include scope=parent file="skins/$SKIN_FOLDER/templates/main.alternate.php"}

{else}

    {include scope=parent file="skins/$SKIN_FOLDER/templates/main.normal.php"}

{/if}

</div>

</body>

</html>

I hope that this clarifies things somewhat. N.b. SMARTY does not know the difference between a .tpl template file and a .php template file. The extension is not important, so all the documentation available on the SMARTY website is still applicable. See: http://www.smarty.net/docs/en/smarty.for.designers.tpl

[Guest KatGirl]

Thanks homar. You are so patient with my pesky mutterings....

I like order. I also like control, so what I did was split my main.php file up into sections and created the following:

header.php

sidebar.php

footer.php

And I gutted the main.php file and popped in this:

{include scope=parent file="skins/$SKIN_FOLDER/templates/header.php"}



<div id="wrapper" class="clearfix">

<!-- start main content & sidebar -->

{include file='templates/box.errors.php'}

{if isset($CHECKOUT_PROGRESS)}{$CHECKOUT_PROGRESS}{/if}



{$PAGE_CONTENT}

<!-- close main content & sidebar -->

</div><!-- close wrapper -->

<div class="clear"></div>



{include scope=parent file="skins/$SKIN_FOLDER/templates/footer.php"}

This works nicely - it reminds me of WordPress, which I know you're a fan of. 



My only issue that I have encountered using this 'WordPress" like method is that while the HTML inside my sidebar.php outputs onto the page, the actual SMARTY or CC info doesn't.



I'm inserting the :

 

 {include scope=parent file="skins/$SKIN_FOLDER/templates/sidebar.php"}

directly inside my content.category.php file (which outputs via (PAGE_CONTENT} macros call) at the end of the file to control where and when my sidebar comes into play.

But its not working quite right. Do you know how to make CC display the contents of box.navigation.php (which is inside my sidebar.php) via content.xxx.php templates?

Thanks a bunch

Kate

PS: The 'extreme' example was merely that. I'm not that extreme :yeahhh:

[Guest KatGirl]

Encountered another issue: the breadcrumb doesn't function inside a content.xxx.php

So I've scrapped the entire idea and I'm starting again.

Wish me luck!

[Homar]

You can only output the variables available to the current scope. The smarty debug console shows the variables available to the current page. You cannot, for instance, add {$BREADCRUMBS} to the content.product.php file. This is because that variable is only available to the main.php file (or any files that you "{include}" from the main.php file with parent scope). This isn't really ideal and differs from Wordpress in this way. So there are some limitations.

[Homar]

I just came across the variable {$SECTION_NAME}. It seems that the developers did consider this after all. This variable can take the values:

• home
• checkout
• product
• document
• download
• saleitems
• category
• login
• order
• account
• giftcertificate
• gateway
• register

You should now be able to do something like this (untested):

{if isset($SECTION_NAME) && ($SECTION_NAME == "home")}

    {include scope=parent file="skins/$SKIN_FOLDER/templates/main.home.php"}

{else}

    {include scope=parent file="skins/$SKIN_FOLDER/templates/main.normal.php"}

{/if}

[Guest johnsimpson]

This post has been invaluable, thankyou!!! I have managed to create seperate pages for homepage, documents etc... Could do with being able to add a seperate template for individual document pages though if this is possible?... A bit like you can do in wordpress?!?!?

I have another question as well, do you know how to create new menu item areas? For example I want to have the Category nav, Copyright nav and also create my own nav to list some other pages... I also need to use active highlighting of various colours for this if anyone knows how?

thanks

J

[Guest KatGirl]

Just to confirm, to introduce a unique home page what Homar suggested works.

{if isset($SECTION_NAME) && ($SECTION_NAME == "home")}

{include scope=parent file="skins/$SKIN_FOLDER/templates/homepage.php"}

{else}

 {include scope=parent file="skins/$SKIN_FOLDER/templates/store.php"}

{/if}

Hope this helps others struggling to tweak their CC5 skins.

KatGirl

[Guest DM613]

Here's what I did for the secret site I really do not want to do as

that gets the code in the kernel, but it seems that it is a code in the variable / function from the beginning.