COMMUNITY FORUM

customize the display of items k2 of certain categories

Start
Prev
1
Next
End

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #155673 by Alaabouch

customize the display of items k2 of certain categories was created by Alaabouch

Hello,

Is it possible to customize the display of items k2 of certain categories. for example, (title of item + extra field) ?

like this exemple : see atachment

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #155733 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

First of all you should use overrides -> getk2.org/documentation/tutorials/174-templating-with-k2-and-the-concepts-of-sub-templates

In the category_item.php file you can perform a simple check like this:

<?php if($item->categoryname == 'CATEGORY_NAME'): 
#code here
endif; ?>

Where you can echo some CSS class which differentiate the layout.

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #155754 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

thank you for attention, I've followed the instructions cited in this connection and is the result :

www.aidepharmacien.ma/allergologie/antihistaminiques-h1

but what I do not understand is that I did call that 4 additional fields! why others are displayed ?

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #155760 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

These are the extrafields. You can hide them by selecting 'Hide' in the category's settings.

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago - 8 years 10 months ago #155767 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi

You can hide them by selecting 'Hide' in the category's settings.

I made it but this is the result :

the option hides all the additional fields :(

I think we have something that deleted the file category_item.php !

Last edit: 8 years 10 months ago by Alaabouch.

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago - 8 years 10 months ago #155772 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

Here I was able to do it, but I know not how to go to the same line as the title !

Last edit: 8 years 10 months ago by Alaabouch.

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #155810 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

You should move the extrafields block next to the title and apply float left to these classes.

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #155829 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

can you give me a hand please. I remove the extra fields to the title but I know not how to apply float right to te class ?

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #155856 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

Here, I just do it! but it's ugly as design. is it possible to integrate them in a table ?

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #155857 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

Here, I just do it! but it's ugly as design. is it possible to integrate them in a table ?

www.aidepharmacien.ma/antalgiques/antalgiques-non-opioides

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #155860 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

I think with these changes it will look nicer -> imgur.com/iRyo5jE

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #155867 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

I have made the change, but I would incorporate the content in a table. is it possible ?

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #155868 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

You can do this, you will have to override the category_item.php file however - getk2.org/documentation/tutorials/174-templating-with-k2-and-the-concepts-of-sub-templates

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #156045 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

honestly I could not do anything !

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #156056 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

Which part did you get stuck on?

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago - 8 years 10 months ago #156071 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

in this code

/* extrafields columns */
.extrafieldscolumns ul { width: 100%; margin:0;padding:0;/* CSS Reset */ max-width: 1000px; /* restrict the width */ margin: 0 40px; /* center it */}.extrafieldscolumns li { width: 20%; float:center; /* IMPORTANT */ list-style-type: none; display:inline; /* IMPORTANT */}
/* END extrafields columns */
div.catItemView.groupLeading{float:left;}
div.extrafieldscolumns{float: left;}

I don't know how do I adjust this code for additional fields align vertically ?

Last edit: 8 years 10 months ago by Alaabouch.

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago #156072 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Please Log in or Create an account to join the conversation.

Alaabouch
Topic Author
Offline
Senior Member

8 years 10 months ago - 8 years 10 months ago #156099 by Alaabouch

Replied by Alaabouch on topic customize the display of items k2 of certain categories

Hi,

there was someone who had me help solve this problem partially. I replace the preceding code with this code in the file override.css

.itemContainer {
display: block;
}
.catItemView {
width: 30%;
}

.extrafieldscolumns ul {
margin: 0;
max-width: none;
padding: 0;
width: 100%;
}

.extrafieldscolumns li {
display: inline-block;
width: 20%;
text-align: right;
}

.extrafieldscolumns li:first-child {
width: 20%;
text-align: left;
}

.extrafieldscolumns li:nth-child(2) {
width: 30%;
}

.extrafieldscolumns li:nth-child(3) {
width: 20%;
}

.extrafieldscolumns li:nth-child(4) {
width: 10%;
}

but the change has been applied in all pages :(

Last edit: 8 years 10 months ago by Alaabouch.

Please Log in or Create an account to join the conversation.

Krikor Boghossian
Offline
Platinum Member

8 years 10 months ago #156129 by Krikor Boghossian

Replied by Krikor Boghossian on topic customize the display of items k2 of certain categories

FYI float:center; is not supported (sadly).

Now, you can create a K2 sub-template and add a class to the wrapper which is specific to that view.

Then your CSS should look like:

YourWrapperClass .itemContainer {
display: block;
}
YourWrapperClass .catItemView {
width: 30%;
}

.YourWrapperClass .extrafieldscolumns ul 
...

More info can be found here: www.joomlaworks.net/blog/item/194-k2-inheritance-sub-templating

Please Log in or Create an account to join the conversation.

Start
Prev
1
Next
End