Grid view

[Fadil Asani]

Hi

How can i make it possible so when viewing in grid or list the following info is there and with icon :before

Titel
Price
Country - City
Category - Subcategory


And how to show date published and date when it wil expire.

[Rudi]

Hello,

Go to admin > Categories > Categories > your primary or parent category > Build > Build Browser Form > add fields you need in the desired order

to display each fields per line go to ftp > templates > your template > css > style.css > find a selector "article.item:not(.no-image) ul.ad-info:not(.with-names) > li.fields"
and remove or comment out lines inside like:

Only registered members can view the code.

and find "article.item:not(.no-image) ul.ad-info > li.title, article.item:not(.no-image) ul.ad-info:not(.with-names) > li.fields, ul.featured.with-pictures ul.ad-info > li.title"
and comment out the following line like:

Only registered members can view the code.

then find "ul.ad-info > li.fields > span:not(:last-child)" and add the following line:

Only registered members can view the code.

to display the date of posting go to your template > tpl > blocks > listing.tpl > find a tag with value 'class="ad-info'
and inside this tag insert this code:

Only registered members can view the code.

Regarding the other design things like icons before the items or changing fields order it will require a cutomizatiion or you can do it yourself using listing.tpl and style.css
as for expiration date some modifications are required in the script

[Fadil Asani]

Thank you. Will try it. Regarding icons. I have added font-awesome to the theme.

[Wei Hong]

Thank you. Will try it. Regarding icons. I have added font-awesome to the theme.

Can you teach me how to add and use font awesome, I have been trying to do that since the icon looks much better and will be crisp on all resolution

[Fadil Asani]

How i did was first upload this font-awesome folder inside the zip to your themes css folder.
Download here https://ufile.io/kbn78

Then go to your themes head.tpl file and ad this line

Only registered members can view the code.

Then you can add fonts via css
Lets say class header needs an icon of arrow

Then you create css

.header:before {
font-family: FontAwesome;
font-size: 16px;
content:"\f047";
}
Content part is for showing the icon you want. The list of icons is in the font-awesome folder > css > font-awesome.css

If you want to use directly in script. Then use <i class="fa fa-arrows></i>

And play a little with style to your needs.

Remember that for icon to show you must dyplicate that css line you want it to show in and ad to the duplicated class :before.

Hope this helps.
If you ad it directly in script then don't need to duplicate anything.