X-Cart forums

[Shiftlocked]

Hi all,

Like the title says, it is at all possible to have your own tabs on the bottom of the product pages. I've a lot of information that I want to put on the site without cluttering it up and I was thinking that the tabbed way might be a way forward.

I was thinking FAQ, Send to a friend, recommended, etc etc

Any suggestions on how to do this.

[ADDISON]

It is easy to do this but you have to edit one php file for creating/arranging tabs and creating also a few template files to add in your tabs the following content:

- tab_description.tpl = showing short + long description
- tab_techinfo.tpl = if you use product classes
- tab_videos.tpl = attaching videos to your product
- tab_accessories.tpl = products you can buy for using with that product
- tab_awards.tpl = if you products has been rewarded who a logo, text, image scanned
- tab_technologies.tpl = for example you can specify in long product description a detail about a fabric, a short one. but here you can explain in detail the fabric with images (e.g. GORE-TEX)
- ...

Personally I will take out the Send to Friend form from tabs. I will create a list with icons like these:

- Ask a question
- Send to a Friend
- Alert price decrease (if product price goes down)
- Back in stock notification (if product is out of stock)
- Pre-order (if product is enable in advance)
- Price match policy

Files to start digging the code:

[XC_Dir]/include/product_tabs.php (for creating/arranging actual/new tabs)
[XC_dir]/skin/common_files/customer/tabs.tpl (for 2 columns and ideal_comfort skin there are other files)

In product_tabs.php you can insert a new tab like this:

$product_tabs[] = array(
        'title'  => 'Videos',
        'tpl'    => 'customer/main/tab_videos.tpl',
        'anchor' => 'videos'

For title you can also use a language variable. Call it in php file like this 'title' => func_get_langvar_by_name('lbl_tab_videos').

Note that in $product_tabs array the first record means the first tab, the last one the last tab. Of course the script could be changed to rearrange position of the tabs in an elegant way (with a new filed called for example "pos").

Now create a template file in [XC_Dir]/skin/common_files/customer/main/tab_videos.tpl containing your videos (you can upload as many as you need using Extra Fields and call the Extra Fields array in your tab content.

If you use YouTube videos, they have an image allocated by default. For example if you check any video image on YouTube it has a URL like this http://i3.ytimg.com/vi/F8PDtxMZhe0/default.jpg. "F8PDtxMZhe0" is the video name you see in your Address Bar. This is an elegant way to use images instead of embedding the video code which will show large images with YouTube content.

[frontliner]

Hi Am2003,

I would need to display my own tabs as follows (to group each product data in the first part of the screen and avoid visitors to have to scroll down through a too long description text) :

Tab1 -> Product short description + thumbnail pic, price, options, add to cart

Tab2 -> Product long description + thumbnail pic, price, options, add to cart

Tab3 -> Product detailed image

Tab4 -> Product technical specifications

Tab5 -> product technical specs (continuation)

Tab6 -> Various (download link) or something else...

I'm not interested to use the tabs as x-cart does, showing 'recommended products', 'send to a friend' and so on...

Something i don't understand :

- tab_description.tpl = showing short + long description

...how to dynamicaly populate this .tpl based on each product called ?

Can you please explain ?

Thanks,

[ADDISON]

@frontliner: I gave you all details in my previous post. Read that post and start doing what you want. The files I mentioned control actual tabs and new tabs. You can deactivate recommends, send to friend commenting the code inside those files.

For showing short description, long description, extra_fields, you have to know the variables available in product page and use them in your new tab templates. For the beginning make a simple test with a new tab template as I suggested.

As an advice you want too many tabs. In my opinion you can group them in maximum 4. Think like a customer not like a developer. Too many information will make no selling. Keep it simple for a fast decision from your customers.

[photo]

What version of Xcart are you using? Have you checked out Dynamic Product Tabs for XCart

[frontliner]

Hi photo,

I'm using 4.4.3. gold.

I knew that mod and also the one from xcartmod.co.uk Ultimate tabbed product menu v.4.4.x but i don't know which one would better suit my needs... i've just checked the demo from WebsiteCM (did not see it before) and it seems to corresponds to what i need.

Tab1 --> product description + picture + price + options
Tab2 --> Technical specifications
Tab3 --> Detailed image
Tab4 --> various (link or something)

@am2003, i'm agree with you, should not have more than 4 tabs. I gave that 6 tabs example only because i was expecting to ask for some piece of code then play with to split existing data onto different tabs the way i wanted.

...also it should be great to be able to display product tabs in Featured Products.

What should be the tab mod that i really need ? WebsiteCM or XCartmod ? ...or are they equal ?

Thanks.

[ADDISON]

I recommend contacting the developers of those 2 mods for further details. Having information directly from the source you can take a decision.

Personally I chose a custom development. If you know basic Smarty + PHP you should deal easy with it and control everything you need.

Originally Posted by frontliner

What should be the tab mod that i really need ? WebsiteCM or XCartmod ? ...or are they equal ?

[totaltec]

Originally Posted by am2003

If you know basic Smarty + PHP you should deal easy with it and control everything you need.

+1

This is a very simple mod, just complex enough to teach you a lot about how X-cart works. First create a custom skin directory, then you won't have to worry about screwing up your existing files. And you can keep all your changes in one place.

You will need a template for each tab that you want to display. You don't need to populate the variables, all the variables you need are already in the arrays. You can use webmaster mode to determine the contents of each variable assigned to the page. I think you would find my tutorials helpful in getting you familiar with smarty.

[frontliner]

I'll try to build some custom code based on your advices and tutorials, just to improve my knowledge, even if i choose anyway to buy a mod to get the store design more quickly updated. I already spent a lot of time with success modifying templates and css to adapt the chromo skin to my needs to fit my store but i'm not yet familiarized at all with smarty and php for more advanced customisations...

[ZFalcon]

Hi Addison,

I just wanted to send you a "thank you" for your info in this thread. It was driving me crazy trying to figure out what to edit (I kept looking at things like "ui_tabs.tpl" and scratching my head) then I found your post and it was so simple! I hadn't even thought of looking at the php files until I saw this.

Sincerely,
David Suit - Fantasia Mining