Page 1 of 1

Embedded Best Sellers Functionality Image Issue

Posted: Mon Jul 15, 2013 2:32 pm
by leej
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.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Mon Jul 15, 2013 8:22 pm
by norman
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.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Mon Jul 15, 2013 10:20 pm
by leej
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.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Tue Jul 16, 2013 6:10 am
by norman
I need to see the mods you've made. Otherwise I'm just guessing. Please post within CODE tags.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Tue Jul 16, 2013 9:32 am
by leej
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.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Tue Jul 16, 2013 10:41 am
by norman
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.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Tue Jul 16, 2013 11:08 am
by leej
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.

Re: Embedded Best Sellers Functionality Image Issue

Posted: Tue Jul 16, 2013 11:20 am
by norman
Super. If you use that in conjunction with my prior post you'll have a clean and simple way of doing this.