I'd like to try to clean up my item description some with three tabs,
Description, Tech Specs, and Contents

I added them to my site on this page
http://motorcycletunes.com/Platinum-Polk-Motorcycle-Speaker-System

I see all three options, but they are shows as text on three different lines, and the links are not working

<p>
<ecttab title="Description"> Description</ecttab></p>
<p>
 </p>
<p>
Platinum Polk Motorcycle Speaker System</p>
<p>
This system is designed to be enjoyed at speeds of 80 mph+ and on bikes with loud pipes or no windshields.  </p>
<p>
This is the Most Powerful, Loudest, Clearest, and Best Priced System in the entire industry. Featuring two handlebar mountable Polk Audio speakers, powered by a very powerful Cerwin Vega amplifier that can be mounted in a saddlebag/travel trunk, or in a fork/handlebar tool bag. The steel housings have a factory quality finish with waterproof Polk Audio speakers installed. The speakers are marine grade to exceed in any condition with Loud, Clear and Crisp music. This system is designed to be enjoyed at speeds of 80 mph+ and on bikes with loud pipes or no windshields.  </p>
<p>
We choose our components based on their performance and nothing else. Our system are built with the best that’s why we are the ONLY company with a Lifetime Warranty.</p>
<p>
Crank It Up, and Enjoy!</p>
<p>
<strong>Simple Installation</strong>: Our kit wires to positive and negative battery terminals, and to a switched and fused power supply on your bike, connect the speakers, plug into the headphone of your device and you are ready to ride! Can be installed by anyone, but if you don#39;t feel comfortable contact your local car audio shop and they can install for you.</p>
<p>
The amplifier can be mounted in a saddlebag, travel trunk, or in a tool/fork bag <a href="https://www.amazon.com/gp/product/B00B2BWOAU/ref=oh_aui_search_detailpage?ie=UTF8&psc=1" target="_blank">SampleBag1</a>, <a href="https://www.amazon.com/gp/product/B00IWGLC7E/ref=oh_aui_search_detailpage?ie=UTF8&psc=1" target="_blank">SampleBag2</a></p>
<p>
 </p>
<p>
 </p>
<p>
<ecttab title="Tech Specs"> Tech Specs</ecttab></p>
<p>
 </p>
<ul>
<li>
1000 Watts Peak - (200 Watts x 2 4 Ohm RMS)</li>
<li>
Amplifier Size: 1.4"H x 4.02"W x 6.61"D</li>
<li>
Waterproof Polk Audio Speakers</li>
<li>
Signal to Noise Radio >90dB</li>
<li>
 </li>
<li>
Highway Rated for 80mph+</li>
<li>
All Weather Rated</li>
<li>
Multiple Mounting Locations (handlebars/crashbars/forks)</li>
<li>
Easy Installation</li>
</ul>
<ul>
<li>
Optional Input Aux input or Bluetooth <br />
<strong>Aux input</strong> <span style="font-family: Arial; font-size: 14.4px; background-color: rgb(255, 255, 255);">AUX Input - plugs into the headphone jack of your favorite personal audio device (Phone, MP3 Player, ect) Option upgrade to add bluetooth capabilities. </span><br />
<strong>Bluetooth Edition with Illuminated Handlebar Mount Controller</strong> for Power/Track/Play/Pause controls</li>
</ul>
<p>
 </p>
<p>
<ecttab title="Contents"> Contents</ecttab></p>
<p>
 </p>
<ul>
<li>
Cerwin Vega Stealth Amplifier (1.4" x 4.02" x 6.61")</li>
<li>
Polk Audio Speakers in weatherproof metal enclosures (5" dia x 4" depth)</li>
<li>
Speaker Mounting Hardware</li>
<li>
All Audio Cable and Power Wires</li>
<li>
3 Feet of Black Wire Dressing</li>
<li>
<a href="http://motorcycletunes.com/prodimages/Ultra%20premium%20speaker%20system%20instructions.pdf">Easy to Follow Installation Instructions</a></li>
<li>
<a href="http://www.motorcycletunes.com/returns.asp" target="_blank">30-day Satisfaction Guaranteed</a></li>
<li>
<a href="http://www.motorcycletunes.com/warranty.asp">Lifetime Warranty</a></li>
</ul>
<p>
 </p>
<p>
Complete Audio System, just add your favorite audio device (phone,MP3 Player, ect)</p>
<p>
 </p>
<p>
 </p>
<p>
 </p>
<p>
 </p>
<p>
 </p>
<p>
 </p>

the problem is that you have not uploaded the js and css files to your server.
You are linking to them on the page here
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
But, both of those return a 404 not found error on your site.

I am using expression web and the projects.twp templates, do i still upload that to the proddetail.asp page under the editable content, or would be overwritten there when I make a change to my template.

on the proddetail.asp page i have it listed here, is that not correct?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- #BeginTemplate "Templates/project.dwt" -->
<head>
<link href="/css/ectcart.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- #BeginEditable "doctitle" -->
<title>Motorcycle Tunes Harley Audio Speaker Stereo Systems</title>
<meta name="keywords" content="motorcycle speakers audio radio stereo harley fairing tunes chrome cycle sounds" />
<meta name="description" content="motorcycle speakers audio radio stereo harley fairing tunes chrome cycle sounds" />
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>

<!-- #EndEditable -->
<link href="style.css" rel="stylesheet" type="text/css" />
<meta name="viewport" content="width=device-width; initial-scale=1.0" />
<style type="text/css">

the SpryAssets folder just needs to be uploaded to the root of your site.
Make sure you have followed instructions here - https://www.ecommercetemplates.com/help/dynamic-tabs.asp

i have uploaded the SpryAssets folder to the root

and on the proddetail.asp i added the following

<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>

and then on the long description field i added the tabs, but they are not functioning correctly.

https://www.motorcycletunes.com/Platinum-Polk-Motorcycle-Speaker-System

Hi

It looks like you are trying to use the sliding panels, is that right? If so, can you add this to includes.asp

ecttabs="slidingpanel"

Andy

Please feel free to review / rate our software

thanks, i got the sliding panels working.
how do i resize the width, so that it displays correctly on a mobile phone?

Sorry but that's not possible with the sliding tabs, you would need to use the static ones - like we have here for example https://www.ecommercetemplates.com/Responsive-Design-Styles-Ecomm-Plus

Andy

Please feel free to review / rate our software

gotcha, I have the responsive site, so i switched to the static tabs and it looks like it is working correctly now. thanks

Andy,

I've implemented the static tabs on my site, but I'm having issues with the CSS in that the tabs are showing the dot for the bulleted list? How do I get rid of that and scoot them over to the left a bit?

Thanks,
Kelley

Hi Kelley

That would be an edit in the spry css file so if you can show us the page, we'll take a look.

Andy

Please feel free to review / rate our software

I figured that, but I've tried everything that I can think of. Try searching for Product ID 1922522 at the site address in my profile, Andy.

I've got this in the SpryTabbedPanels.css file:
list-style: none;

So, I thought perhaps it was conflicting with another CSS file somewhere that affects that same page, so I added the ole !important to the list-style and margin elements and got what I wanted. :)

list-style: none !important;
margin: 0px 4px 0px 0px !important;

Thanks,
Kelley

I'm having trouble viewing any of your product detail pages eg proddetail.asp?prod=Catchfly_Avery_Purse_Aztec - I'll try again later in case it's a server glitch but let me know if it's working for you.

Andy

Please feel free to review / rate our software

Hi Andy,

Yes, so am I! I have no clue what has happened. I was happily working on updating some products and relating them to others when all of a sudden I can't get anything to come up on the proddetail.asp pages! Do you think something is wrong with the database or the page? I have submitted a support ticket to Hostek.



Kelley

Were you using the product name in the detail page URL before? I mean the same format of the URL of proddetai.asp, nothing has changed there?

Andy

Please feel free to review / rate our software

I see the page working now. Add this to your spry css file

.TabbedPanelsContentGroup li{
list-style: none !important;
margin-left:0px !important
}

Andy

Please feel free to review / rate our software

Thanks, Andy! I got it all sorted out.

Kelley

Hi All,

After adding the text below using the web expression editor, it :

<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>

I get a pop up box giving me two options,

1. Always restore non-editable content while editing this page

2. Keep all changes (Another tick box within this option to detach from dynamic web template)

I am guessing i chose option 2 but do not tick to detach from the dynamic web template

?

Thanks

Jason

Hi All,

I have added the line:

$defaultdescriptiontab='<ecttab title="Description">'; But the description tab doesnt appear.

to the includes file, but notice in the default file it also has

$defaultdescriptiontab='<ecttab title="#xf036;   Info">';

Can anyone help.

Jason

Hi Jason, in expression web, you should have, if not create, an editable region in the head section of the DWT file.
This will allow you to add that link to the css and js files in the head of the individual pages that need it.

You can check the source of the page in your browser to be sure the links are there, and you can check to be sure they are linked to the actual files ( and the files exist on the server).

<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>

If those are not linked correctly, the spry tabs will not work.
If you want someone to take a look, please provide a link to the page.

Thanks,
David

This is the source code when viewing the code from a browser

<!DOCTYPE html><html lang="en">
<!-- #BeginTemplate "Templates/main.dwt" -->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- #BeginEditable "doctitle" -->
<title>RAVENNA EXCLUSIVE LADY BUSINESS BAG BROWN, Briefcases, BG-TL141795</title>
<meta name="Description" content="Main features - Full grain hand stained calfskin leather - Semi-rigid structure - 1 compartment Product measurements ( decimal Imperial ) - Dimensions: 40.00 x 30.00 x 11.00 cm - Weight: 0.90 Kg - EAN: 8054383739622 Composition - Full grain hand stained calfskin leather - Polyester lining Features - Semi-rigid structure - 1 compartment Outside part - Protective metal feet on the bottom Inside part - Inside zip pocket - 2 pockets - Pen holder">
<!-- #EndEditable -->
<link href="css/ectcart.css" rel="stylesheet">
<script type="text/javascript" src="js/ectcart.js"></script>
<link href="css/minidropdowncart.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet">
<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
<link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet'>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/megastyle.css">
<link rel="stylesheet" href="css/ionicons.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<!-- #BeginEditable "head" -->
<link href="css/ectstyle1.css" rel="stylesheet" type="text/css" />
<meta property="og:type" content="product" />
<meta property="og:image" content="http://www.mypage.co.uk/prodimages/Untitled-2-2.jpg" /><link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<!-- #EndEditable -->
<style type="text/css">

.auto-style1 {
color: #FF0707;
}
</style>

<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>

</head>