Embedded Best Sellers Functionality Image Issue

Tabbed Product and Fragment Descriptions.
Post Reply
leej
Posts: 46
Joined: Thu May 17, 2007 10:03 am
Location: Otley, Leeds
Contact:

Embedded Best Sellers Functionality Image Issue

Post by leej » Mon Jul 15, 2013 2:32 pm

Hi Norman,
I have applied the fragment tabber functionality to a clients homepage where, based on previous instructions, I have been able to create two embedded tabs to display the 'Homepage best Sellers' & 'Homepage New Products' layout. For some reason there seems to be a minor conflict between the tabber and the best sellers/new arrival functionality as the variable 'ProductImagefilename' will not pull in the image. I have applied the Homepage Best Sellers Layout outside of the tabber functionality and the images show. When I check the code via Firebug within Firefox and find the source of the file it states "Products/no-image.jpg", which is partly correct. It seems that the Full URL is not passed across.

The development site can be found at: http://dev6.centurius.co.uk

Any advice would be greatly appreciated.

Regards.
Lee.

norman
Site Admin
Posts: 1237
Joined: Sat Feb 07, 2004 9:55 pm

Re: Embedded Best Sellers Functionality Image Issue

Post by norman » Mon Jul 15, 2013 8:22 pm

Variable "ProductImagefilename" is just the filename of the image file. Not the full HTML code needed to display an image.

You'd need <img src="ProductImageFileName" /> at a minimum to do this. But it's better to include the width and height. Look in layout Standard Product Image for the full HTML.
Norman

leej
Posts: 46
Joined: Thu May 17, 2007 10:03 am
Location: Otley, Leeds
Contact:

Re: Embedded Best Sellers Functionality Image Issue

Post by leej » Mon Jul 15, 2013 10:20 pm

Hi Norman, I did'nt explain properly. The variable does have the img src code around it already. As I said previously outside of the tabber the images appear. When embedded within they don't.

norman
Site Admin
Posts: 1237
Joined: Sat Feb 07, 2004 9:55 pm

Re: Embedded Best Sellers Functionality Image Issue

Post by norman » Tue Jul 16, 2013 6:10 am

I need to see the mods you've made. Otherwise I'm just guessing. Please post within CODE tags.
Norman

leej
Posts: 46
Joined: Thu May 17, 2007 10:03 am
Location: Otley, Leeds
Contact:

Re: Embedded Best Sellers Functionality Image Issue

Post by leej » Tue Jul 16, 2013 9:32 am

Hi norman,
Thansk for getting back to me. The amended code below is for the 'TabbedFragmentText' layout.

Code: Select all

<actinic:block php="true">
// Tabbed Fragment Description V4.01
$permtabs = <<<TBPRDSC
{<actinic:variable formatting="font(Color|ff6600)" name="CompanyName" /> Best Sellers}
<actinic:variable name="BestSellersList" value="Home Page Best Sellers List" />
{<actinic:variable formatting="font(Color|ff6600)" name="CompanyName" /> New Arrivals}
<actinic:variable name="NewProductsList" value="Home Page New Products List" />
TBPRDSC;
$anc = '<actinic:variable name="ListIndex" encoding="perl" selectable="false" />';
$desc = <<<TBPRDSC
<actinic:variable name="FragmentText" selectable="false" />
TBPRDSC;

if ( preg_match('/(.*?)(&#123;.+?&#125;.*)/s', $desc, $bits) )	// is there at least one tab?
	{
	$panecount = 0;
   $tabhtml = '';
	$before = $bits[1];
	$after = '';
//$tabcode = $bits[2];
	//if ( preg_match('/(.*?)&#123;&#125;(.*)/s', $tabcode, $bits) )	// optional {} signifies end of tabbed text
		//{
		//$tabcode = $bits[1];
	//	$after = $bits[2];
		//}
	//echo $before; 
	echo '<actinic:variable name="TabPrefix" encoding="perl" selectable="false" /><div class="tabber"><div id="tabber_' . $anc . '" class="dp_tab_widget"><ul class="tabnav" style="font-size:18px;">';
	$permtabs = str_replace('{', '&#123;', $permtabs);
   $permtabs = str_replace('}', '&#125;', $permtabs);
   $tabcode .= $permtabs;  
	while ( preg_match('/&#123;(.*?)&#125;(.*)/s', $tabcode, $bits) )
		{
		$tabname = $bits[1];
		$tabtext = $bits[2];
		$tabcode = '';
		if (  preg_match('/(.*?)(&#123;.+&#125;.*)/s', $tabtext, $bits) )	// more tabs?
			{
			$tabtext = $bits[1];
			$tabcode = $bits[2];
			}
		// output current tab
		echo '<li><a href="#tab_' . $anc . '_' . $panecount . '" style="padding: 0.3em 0.5em;"><span>' . $tabname . '</span></a></li>';
		$tabhtml .= '<div id="tab_' . $anc . '_' . $panecount . '" class="tabdiv"><table class="tabinner"><tr><td>' . $tabtext . '</td></tr></table></div>';			// save the contents of the tab for later
		$panecount++;
		}
	echo "</ul>";
   echo "$tabhtml</div></div>
";			// output all the tab text
	echo '<actinic:variable name="TabSuffix" encoding="perl" selectable="false" />';
	echo $after; 		
	}
else
	{
	echo $desc;	// no tabs, so output text unaltered
	}
</actinic:block>
Below is the layout for the Mini Best Seller Layout

Code: Select all

<div style="width:220px;">   
<div class="product_image_cost">
      <actinic:block if="%3cactinic%3avariable%20name%3d%22ProductImageFileName%22%20%2f%3e%20%21%3d%20%22%22" >
			<a href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable Name="ProductID" />&NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&SHOP=<actinic:variable name="ShopID" /></actinic:block>">
				<img style="border:1px solid #ccc;" src="<actinic:variable name="ProductImageFileName" />" height="216" width="216" alt="<actinic:variable name="ProductName" encoding="strip"/>" />
			</a>
      </actinic:block>
   </div>
   <div style="margin-top:15px;">
		<p class="text_product_small_info_heading"><actinic:variable name="ProductName" /></p>
      <p class="text_product_small_info_price">
      <Actinic:PRICES PROD_REF="<actinic:variable Name="ProductID" />" RETAIL_PRICE_PROMPT="<Actinic:Variable Name="ProductPriceDescription"/>">
         <actinic:variable value="Marketing Price List" name="PriceListRetail" />
      </Actinic:PRICES>
      </p>
      <p class="text_product_small_info">
      <a href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable Name="ProductID" />&NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&SHOP=<actinic:variable name="ShopID" /></actinic:block>">View Item</a></p>
   </div>
</div> 
Thanks for your help on this one.

Regards.
Lee.

norman
Site Admin
Posts: 1237
Joined: Sat Feb 07, 2004 9:55 pm

Re: Embedded Best Sellers Functionality Image Issue

Post by norman » Tue Jul 16, 2013 10:41 am

The changes you've made to TabbedFragmentText are complicated. It's best not to change anything below:

Code: Select all

// Tabbed Fragment Description V4.01
$anc = '<actinic:variable name="ListIndex" encoding="perl" selectable="false" />';
$desc = <<<TBPRDSC
<actinic:variable name="FragmentText" selectable="false" />
TBPRDSC;
E.g. You may get your functionality by simply:

Code: Select all

// Tabbed Fragment Description V4.01
$anc = '<actinic:variable name="ListIndex" encoding="perl" selectable="false" />';
$desc = <<<TBPRDSC
<actinic:variable name="FragmentText" selectable="false" />
&#123;Best Sellers&#125;
<actinic:variable name="BestSellersList" value="Compact Best Sellers List" />
&#123;New Arrivals&#125;
<actinic:variable name="NewProductsList" value="Compact New Products List" />
TBPRDSC;
I've simplified the code above so that others will be able to use it, so it's just an example.

Note that you need to ensure that the products within these lists do not themself contain tabbed descriptions or things get complicated.

I recommend that you make changes as above (using the original TabbedFragmentText layout) and once that's done we can see why the image isn't working.
Norman

leej
Posts: 46
Joined: Thu May 17, 2007 10:03 am
Location: Otley, Leeds
Contact:

Re: Embedded Best Sellers Functionality Image Issue

Post by leej » Tue Jul 16, 2013 11:08 am

Hi Norman,
I found the solution to the problem within another of your tabber forum articles 'Displaying Actinic items in the addtional tabs'. There is a sub article entitled 'Fix if images are being used inside additional tabs.' where you change:

Code: Select all

    <actinic:variable name="ProductImageFileName" />
with...

Code: Select all

    <actinic:block php="true">echo str_replace('\\', '/', '<actinic:variable name="ProductImageFileName" encoding="perl" selectable="false" />');</actinic:block>
I applied that and it works a treat. Thanks for your help regarding this.

Regards.
Lee.

norman
Site Admin
Posts: 1237
Joined: Sat Feb 07, 2004 9:55 pm

Re: Embedded Best Sellers Functionality Image Issue

Post by norman » Tue Jul 16, 2013 11:20 am

Super. If you use that in conjunction with my prior post you'll have a clean and simple way of doing this.
Norman

Post Reply