How'd you do that? - www.68classifieds.com/modifications

[sleepy +]

Hi Eric,

Is it possible to see the html code for your showlisting.tpl and viewlisting.tpl pages on the new http://www.68classifieds.com/modifications classifieds site?

As I am in the process of designing templates for my site and would like to be able to see (and compare) the changes you made to the 'modification' template files ... to the 'default' template files ... to help me get my head around the code.

I would also be interested, if possible, in knowing how you did the funky popup when you click on the image on the viewlisting.tpl

Cheers,
sleepy

v3.0.1

[Eric Barnes]

Here is the link to the popup script:
http://www.huddletogether.com/projects/lightbox2/

Attached is our template files if you want to play with them.

[sleepy +]

Eric,

Thanks a heap!!

sleepy

[thanhminh]

thanks . I hope you will have more

[free2take +]

Thanks for this post, this is an excellent little modification.

I have one question I modified my viewlistings.tpl.php file to replace the following code

PHP Code:

      <td valign="top" class="pformright">
      {if $viewphotos=="Y"}
              {foreach from=$data item=image}
                   <p><a href="#" onMouseOver="window.status='View Large Image';return true" onMouseOut="window.status='';return true" onClick="window.open('{$smarty.const.URL}/viewimage.php?photo={$image.id}','_popup','width=450,height=500,directories=no,location=no,menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=no,left=0,top=0,screenx=50,screeny=50');return false"> <img src="thumbs/small_{$image.image}" hspace="5" vspace="5" class="image" border="0" /></a><br />{$image.title}</p>
                {foreachelse}
             <img src="images/nophoto.gif" width="100" hspace="5" vspace="5" border="1" />
              {/foreach}
      {/if} 


with

PHP Code:

      <td valign="top" class="pformright">
      {if $viewphotos=="Y"}
            {html_table_adv loop=$data cols=$cols table_attr='width="100%"' td_attr='align="center" width="120"'}
                <a href="photos/[[image]]" rel="lightbox[image]" title="[[title]]"><img src="thumbs/small_[[image]]" hspace="5" vspace="5" class="image" border="0" /></a><br />[[title]]
            {/html_table_adv}                
            {*{foreach from=$data item=image}
                <p><a href="#" onMouseOver="window.status='View Large Image';return true" onMouseOut="window.status='';return true" onClick="window.open('{$smarty.const.URL}/viewimage.php?photo={$image.id}','_popup','width=450,height=500,directories=no,location=no,menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=no,left=0,top=0,screenx=50,screeny=50');return false"> <img src="thumbs/small_{$image.image}" hspace="5" vspace="5" class="image" border="0" /></a><br />{$image.title}</p>
            {foreachelse}
                 <img src="images/nophoto.gif" width="100" hspace="5" vspace="5" border="1" />
            {/foreach}*}
      {/if} 


but now I get an error when no photo is available, is there an easy way around this ?

Thanks in advance,
Mully

Great found a solution, here's the code:

PHP Code:

 {if $viewphotos=="Y"}
        {if empty($data)}
            <img src="images/nophoto.gif" width="100" hspace="5" vspace="5" border="1" />
        {else}
            {html_table_adv loop=$data cols=$cols table_attr='width="100%"' td_attr='align="center" width="120"'}
                <a href="photos/[[image]]" rel="lightbox[image]" title="[[title]]"><img src="thumbs/small_[[image]]" hspace="5" vspace="5" class="image" border="0" /></a><br />[[title]]
            {/html_table_adv}
        {/if}
                  {/if} 


[GPM55 +]

looks cool, but does it have any real purpose? Any negative effects on search engine optimization and not being able to see alt image tags or anything? What happens when java is disabled?

[pauljr +]

I really hate to keep posting questions but I have tried everything to get this going on my server but no luck. I'm running IIS 6 with v3.1.1 dev of 68class. I have the Lightbox example running fine (see below). I added these 4 lines to the top of viewlistings.tpl.php and changed the image snip of code to the snip below. I also took Erics showlisting and showlistings2 templates and put them in my template directory to test with. When you hold your mouse over the thumbnails they are still linking to www.buyswapsell.com/# instead of www.buyswapsell.com/photos/[image]


{* Lightbox lines I added *}
<script type="text/javascript" src="javascript/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="javascript/lightbox/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="javascript/lightbox/js/lightbox.js"></script>
<link rel="stylesheet" href="javascript/lightbox/css/lightbox.css" type="text/css" media="screen" />


{* Lightbox lines I Changed near bottom of viewlistings.tpl.php}

<td valign="top" class="pformright">
{if $viewphotos=="Y"}
{if empty($data)}
<img src="images/nophoto.gif" width="100" hspace="5" vspace="5" border="1" />
{else}
{html_table_adv loop=$data cols=$cols table_attr='width="100%"' td_attr='align="center" width="120"'}
<a href="photos/[[image]]" rel="lightbox[image]" title="[[title]]"><img src="thumbs/small_[[image]]" hspace="5" vspace="5" class="image" border="0" /></a><br />[[title]]
{/html_table_adv}
{/if}
{/if}

Example lightbox working:
http://www.buyswapsell.com/javascrip...box/index.html

[Lhotch +]

Originally Posted by pauljr

{* Lightbox lines I Changed near bottom of viewlistings.tpl.php}

The comment you have above is most likely your problem. You have your site setup to use viewlisting2.tpl.php.

As for the template files Eric has above, that post was made 5/2006 so I am betting the version of 68C he was suing at the time was likely different than what you are using today, almost a year and a half later.

[pauljr +]

That was indeed what my problem was. I didn't realize viewlisting2.tpl.php was what It was actually using. Thanks for the pointer.