How To Display Individual Image & Description For Each Category?

[sam123]

Looking for help on customizing the greenleaf template to dispaly an image and a discription for each category on the front page like this site: http://www.amishhome.net/ or this site: http://www.raz-sports.com/sports-web-directories.html

[Vincent Wright]

Right now the script allows you to display Alexa thumbs in listsings. Go to Admin Panel >> Configuration >> Link Details page >> enable Alexa thumbnails.

If you want to display some custom images this will require script/template modification.

[redeye]

The only way I can see that you could mirror the design of an image and a description for each category would be to create a new index.htm page and then create a table with an image cell and a description cell.
You would then have to manually update this page everytime you created a new category. But I think it would allow you to link to the category listing by using the URL that is automatically created by eSyn.
If you look at a URL for a standard category for example "Business" it's something like: www.yourdirectory.com/directoryfolder/business - and that should work.

[Dave Baker]

hello sam123,

For this purpose necessary to make a changes in a database and several files
In the database necessary to create an additional field for storage URL of a picture.
***Open table yoursprefix_categories and execute SQL query***

ALTER TABLE `yoursprefix_categories` ADD `url_pic` TEXT NOT NULL ;

Do not overlook to replace yoursprefix_ on yours prefix in SQL query!!!
For this action you can use phpMyAdmin or other methods.
after that,
***open file admin\suggest-category.php and find block of code:***

PHP Code:

<tr>
<td><strong>Category meta-keywords:</strong></td>
<td><textarea name="meta_keywords" cols="43" rows="8"><?php echo $tmp['meta_keywords']; ?></textarea></td>
</tr>

***After that code add***

PHP Code:

<tr class="tr">
<td><strong>URl Pictures:</strong></td>
<td><input type="text" name="url_pic" size="57" value="<?php echo $tmp['url_pic']; ?>"></td>
</tr>

***Scroll the file in top and find line of code***

PHP Code:

$temp['meta_keywords'] = addslashes($tmp['meta_keywords']); 


***After that line add***

PHP Code:

$temp['url_pic'] = addslashes($tmp['url_pic']); 


***Save file***
***Open file Layput.php in yours temlate***
***About 202 line find code***

PHP Code:

                    $out .= "<div class=\"categ\"><a href=\"{$url}\">".htmlspecialchars($value['title']).$crossed."</a>{$cause}</div>"; 


***Replace this code with the following:***

PHP Code:

$out .= "<div class=\"categ\"><table><td><img height=\"80\" width=\"80\" src=\"".$value['url_pic']."\"><td><a href=\"{$url}\">".htmlspecialchars($value['title']).$crossed."</a><td>{$cause}</table></div>"; 


***About 214 line find code***

PHP Code:

$out .= "<div class=\"categ\"><a href=\"{$url}\">".htmlspecialchars($value['title']).$crossed."</a>{$cause}</div>"; 


***Replace this code with the following:***

PHP Code:

$out .= "<div class=\"categ\"><table><td><img height=\"80\" width=\"80\" src=\"".$value['url_pic']."\"><td><a href=\"{$url}\">".htmlspecialchars($value['title']).$crossed."</a><td>{$cause}</table></div>"; 


The size of a picture 80x80. The size changes in two last added lines.
in <img height=\"80\" width=\"80\" src=\"".$value['url_pic']."\">

Let me know if you have questions.

[tibetsites]

I am using skystarsblue template...i did not find the exact code as mentioned above for layout.php and also couldnt not find exact code as mentioned for category description in the "suggestcategory.php. Is it because of the template or [do I have to first do the phpMyadmin thing and only then it should show up?]...Kindly give some suggestion..is there some difference in template? ..what needs to be done.

[Dave Baker]

The path to a picture can be relative(admin/img/logo.gif) or absolute(http://www.esyndicat.com/forum/images/misc/logo.gif)

[sam123]

Thanks so much Dave for the excellent guide it worked. The editor_categories page also needs to be changed to give the option to modify the image, which i'm not sure myself how to do it. One final detail: how to we display the category discription on the index page?

Thanks,
Sam

[sam123]

Okay, Dave I figured out the change required for the edit page. the page admin/edit-category.php needs the same changes as we did in the admin/suggest-category.php page

[Greg]

Originally Posted by sam123

One final detail: how to we display the category discription on the index page?

Thanks,
Sam

Hi Sam

I came up with this a long time ago. I hope this is what you want.
Please backup file before editing.

Open layout.php
Find: (It appears twice)

PHP Code:

$out .= "<div class=\"categ\"><a href=\"{$url}\">".htmlspecialchars($value['title']).$crossed."</a>{$cause}</div>"; 


Now just below that line add:

PHP Code:

$out .= "<div class=\"categ\">".htmlspecialchars($value['description']).$crossed."</div>"; 


That will give you "category description" Remember you have 2 places you need to add this in layout,php

If you would rather use the meta-category description Use this code instead:

PHP Code:

$out .= "<div class=\"categ\">".htmlspecialchars($value['meta_description']).$crossed."</div>"; 


Hope that's whai you were asking?

[sam123]

Thanks Greg that's exactly what I was looking for, it worked great. Currently I'm faced with a small problem here.

When I set the categories in admin config to display only 1 column the width of the column will stay the same size not streching out till the end of the div. I tried editing the css to 100% but it didn't help, here:

div.categories div.col
{
float: left;
height: 100%;
text-align: left;
width: 100%;
padding-top: 15px;
position: relative;
}

Thanks again