Home N-13 News Forums Help Search
RegisterForgot password?
How to add image to post necklacesdiscou
Known bugs - 4.0.3 necklacesdiscou

Latest N-13 News 4.0.3

What is N-13 News?
Where can I get help?
Known bugs

Forums Help & Support Assign a specific image for each category
Yemeth
Posted on 29 Mar 2010, 02:48:08

Access: Member
Total Posts: 3
Joined: 2010-03-29

Hello,
before hours looking for an answer, I finally decided to post my request.

I would like to create a template with a specific image for each category, to automatically display it next to the text. My difficulty is to write an image path that can differ in function of the category of the news. I tried to use php variable in the template editor but it seems that it accepts only html/css.
My idea would be to put the category image with a simple tag like {title} or {story}, using something like {imgcategory}.

I hope that was clear !
Thank you for your answers.
#2160
Chris
Posted on 29 Mar 2010, 13:25:02

Access: Admin
Total Posts: 1395
Joined: 2006-05-19

Yemeth,

I have thought about this before. When creating/editing categories there would be a new field for you to enter the URL of an image, then add the {catimage} tag to the templates. The problem with this is that news articles can be assigned to multiple categories, so this would create a new problem with how exactly to display the images.

A way around this would be to use a bit of CSS. When you add a news article to a category then specify the {categories} tag within the template, the category name gets shown. It gets wrapped in a <span> element with the name of the category added to it.

For example if you have a category named "Sports" it will be displayed like so

Code:
<span class="cat_sports">


Which means you can use some CSS to target that element, size it and add an image like so

Code:
.cat_sports {
display: block;
height: 100px;
width: 100px;
background-image: url('http://example.com/images/sports.jpg');
}
#2164
Last edited by Chris at 2010-03-29 13:32:06 Reason:
Yemeth
Posted on 29 Mar 2010, 16:00:20

Access: Member
Total Posts: 3
Joined: 2010-03-29

Thanks a lot Chris, it works ! I didn't know that a span element was created with {categories}...very usefull ! I just want to specify that the CSS code is to place on the web site itself, not in the template editor (I tried ... :confused:).

Now this is working, I would like to assign a link on the category image to the specific category page (no problem with the category page, I used this). Since the image is a background, I guess it is better to assign the link to the text category itself. So I tried this in the template editor to create the link:

Code:
<a href='{categories}.php'>{categories}</a>


Indeed, this create a specific ugly link for each category such :

Code:
 <span class="cat_sports">sports</span>.php


But there no way to save a page with such a name...
Any idea ?

#2165
Chris
Posted on 29 Mar 2010, 16:07:28

Access: Admin
Total Posts: 1395
Joined: 2006-05-19

I'm going to make a change in version 3.5, instead of wrapping the category names in a span element simply show the name only. So that you'll be able to do what you requested in your first thread like so

Code:
<span class="cat_{categories}">{categories}</span>


This would make also allow you to create the hyperlink like so

Code:
<a href="{categories}.php"><span class="cat_{cateegories}">{categories}</span></a>


Anyway, to do this in version 3.4 you'll just need to edit functions.php, around line 145~ you'll see this line of code

Code:
$categories .= "<span class=\"cat_" . $cat['catname'] . "\">" . $cat['catname'] . "</span>" . $catdelimiter;


Change that to

Code:
$categories .= $cat['catname'] . $catdelimiter;


Then you should be able to create the hyperlink the same way I did above.
#2166
Yemeth
Posted on 29 Mar 2010, 16:24:48

Access: Member
Total Posts: 3
Joined: 2010-03-29

This is perfect, exactly what I wanted.
Thanks a lot for your efficiency and speed !
#2167
Network-13.com © 2013