1 Topic by TorbenRasmussen (edited by 2015-05-05 11:23:34)

  • Registered: 2011-04-04
  • Posts: 13

Topic: Change how {category-id} is printed

I am trying to use the {category-id} tag to set CSS classes for each entry, but I have a hard time finding the place in the php code where I change it. Currently, if you add {category-id} to a .tpl template, it will print the associated categories as "1,2,3,5,12" i.e. a sequence only delimited by a comma.

What I would like to do is to have each entry posted using a template file looking somehting like (simplified):
<div class="{category-id}">{title}{short-story}</div>

but you can't have commas in a class declaration in CSS, so I need to change what is being printed. Ideally the code would add some prefix in front of the category number and a space after the number, so I would get somehing like this in my final HTML output, when I use the above code from the .tpl:
<div class="cat1 cat2 cat3 cat5 cat12">Title - Some short story</div>

Where do I find the code that adds the comma to the {category-id} when used in a .tpl file to write my HTML?

  • Registered: 2012-09-21
  • Posts: 113

Re: Change how {category-id} is printed

I am trying to use the {category-id} tag to set CSS classes for each entry, but I have a hard time finding the place in the php code where I change it. Currently, if you add {category-id} to a .tpl template, it will print the associated categories as "1,2,3,5,12" i.e. a sequence only delimited by a comma.

What I would like to do is to have each entry posted using a template file looking somehting like (simplified):
<div class="{category-id}">{title}{short-story}</div>

but you can't have commas in a class declaration in CSS, so I need to change what is being printed. Ideally the code would add some prefix in front of the category number and a space after the number, so I would get somehing like this in my final HTML output, when I use the above code from the .tpl:
<div class="cat1 cat2 cat3 cat5 cat12">Title - Some short story</div>

Where do I find the code that adds the comma to the {category-id} when used in a .tpl file to write my HTML?


Hello,

to have a unique class-name you can use the {page_alias} var

greetings

john

3 Reply by TorbenRasmussen (edited by 2015-05-06 06:21:29)

  • Registered: 2011-04-04
  • Posts: 13

Re: Change how {category-id} is printed

Hello,

to have a unique class-name you can use the {page_alias} var

greetings

john


I don't need a unique class. I need the class to follow the categories so I can apply filtering on the entries once they are added to my page. This would also allow me to style each category differently without using multiple cutenews calls.

To clarify what I am trying to do, I would like to use the "isotope" framework for both arranging my entries and filtering them on my homepage.
http://isotope.metafizzy.co/filtering.html
and for this I need to be able to have some way of attributing the same class to items belonging to the same category. I have it working now, but only for items with 1 category assigned to them. As soon as I add more cutenews prints the categories in a way that ruins everything (as described above).

I can't quite see how {page_alias} works? If I add it to my .tpl nothing happens. It just prints {page_alias}? Is there any documentation on how to use it?

I am willing to edit the php-scripts behind cutenews to get this working, but I have searched through all files and I can't find anywhere where the comma is added, so I can change it and append a "cat" in front and a "space" after each printed catogory when using {category-id}.

  • Registered: 2012-09-21
  • Posts: 113

Re: Change how {category-id} is printed

I don't need a unique class. I need the class to follow the categories so I can apply filtering on the entries once they are added to my page. This would also allow me to style each category differently without using multiple cutenews calls.

To clarify what I am trying to do, I would like to use the "isotope" framework for both arranging my entries and filtering them on my homepage.
http://isotope.metafizzy.co/filtering.html
and for this I need to be able to have some way of attributing the same class to items belonging to the same category. I have it working now, but only for items with 1 category assigned to them. As soon as I add more cutenews prints the categories in a way that ruins everything (as described above).

I can't quite see how {page_alias} works? If I add it to my .tpl nothing happens. It just prints {page_alias}? Is there any documentation on how to use it?

I am willing to edit the php-scripts behind cutenews to get this working, but I have searched through all files and I can't find anywhere where the comma is added, so I can change it and append a "cat" in front and a "space" after each printed catogory when using {category-id}.


If you use multiple categories a comma is set for each categories,
but you can delete the commas with js like this: http://stackoverflow.com/questions/5115152...-replace-string.


  • Registered: 2011-04-04
  • Posts: 13

Re: Change how {category-id} is printed

I guess that could be one way of doing it. I was rather hoping to catch things at the source, as I would never need to have the ID's of my categories printet elsewhere. Another issue is that what I am trying to get rid of is something as common as a comma... doing a search and replacing all commas might corrupt the page quite a lot if I am not careful.

The link you provided does give some hints to replacing a string, but all of them searches through the entire body of a document. Maybe it could be aimed at a specific DIV class, but keep in mind what cutenews is used for - the page would contain quite a lot of text and I don't want my commas stripped from that. Another issue is that I need to make sure the isotope-script is not execute before all text has been replaced otherwise it will fail.

Advice regarding a fix at the root of the problem is still appreciated.

  • Registered: 2011-04-04
  • Posts: 13

Re: Change how {category-id} is printed

I got some advice on StackOverflow saying I could use something like this:
http://stackoverflow.com/questions/3007100...ass-declaration

I'll try it out and report back if anyone else should be interested in something similar. The isotope JS is pretty neat in terms of dynamic filtering.

  • Registered: 2012-09-21
  • Posts: 113

Re: Change how {category-id} is printed

I got some advice on StackOverflow saying I could use something like this:
http://stackoverflow.com/questions/3007100...ass-declaration

I'll try it out and report back if anyone else should be interested in something similar. The isotope JS is pretty neat in terms of dynamic filtering.


i use this php script to filtering the categories: 

$category = $_GET["kategorie"];
$page_alias = $_GET["seite"];
$template= $_GET["vorlage"];

include("cutenews/show_news.php");

my navigation(static): 

     * [url=https://cutephp.com/forum/index.php?kategorie=ein&vorlage=projekte]eins[/url]

      * [url=https://cutephp.com/forum/index.php?kategorie=zwei&vorlage=projekte]zwei[/url]

      * [url=https://cutephp.com/forum/index.php?kategorie=frei&vorlage=default]drei[/url]

  • Registered: 2011-04-04
  • Posts: 13

Re: Change how {category-id} is printed

I went ahead and tried the solution with js to change the category afterwards and it works pretty well. One downside is, though, that using pagination looks odd when you apply an external filter as can only remove elements - not get more than what you already specified per page in the cutenews call. I guess that is not an issue with your solution as you call cutenews again for each filter and get served a brand new page each time.

  • Registered: 2012-09-21
  • Posts: 113

Re: Change how {category-id} is printed

I went ahead and tried the solution with js to change the category afterwards and it works pretty well. One downside is, though, that using pagination looks odd when you apply an external filter as can only remove elements - not get more than what you already specified per page in the cutenews call. I guess that is not an issue with your solution as you call cutenews again for each filter and get served a brand new page each time.


Content filter without JS: http://codepen.io/samgordon/pen/jPqqWB

  • Registered: 2011-04-04
  • Posts: 13

Re: Change how {category-id} is printed

Content filter without JS: http://codepen.io/samgordon/pen/jPqqWB

The issue is still that you can't get CuteNews to spit out a category into the class if the item has multiple categories in any other form than a long string of categories separated by a comma only. That is no good for assigning classes.