Portfolio Sort and Category Buttons

Support
#1

Hello there,

I have a portfolio page that is working fine.
The sort button is visible and clicking on it shows the categories buttons.
Is there a way that on the open of the page I can immediately see the categories button without clicking on the Sort button ?
Probably better formulated:
Can hide sort button and show only category buttons ?

Thanks for the help,
best regards,
Roberto

#2

Hi Roberto,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you.

#3

Hello Jade,

the address is :

http://sjo-hokar.it/come-dormivamo/

Best regards,

Roberto

#4

Hello Roberto,

Thanks for providing the url of your site. To hide sort button and show only category buttons, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.option-set .x-portfolio-filters {
    display: none;
}

ul.x-portfolio-filters-menu.unstyled {
    display: block;
}

We would loved to know if this has work for you. Thank you.

#5

Hello RueNel,

thanks for the support.

It works just I intended to be.

But I have a problem, how can I apply this css to only one portfolio page of the two I have.

and
one last thing.
Is it possible to change the category button to an icon or similar.
What I am trying to achieve here is been able to sort by room all my friends in the more user friendly possible way.

Thanks again for the support.

Best regards,

Roberto

#6

Hi there,

Please add a class in the Body CSS Class(es) in the Page Settings then add the following update the previous code to (assuming that the class you have added is this-page):

.this-page .option-set .x-portfolio-filters {
    display: none;
}

.this-page ul.x-portfolio-filters-menu.unstyled {
    display: block;
}

Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding. Take care!

#7

Understood.
Thank you very much.
Great support as always.
Roberto

#8

You’re most welcome, Roberto.

#9

Hello Jade, sorry for reopening the same thread but I am facing the following problem with the given tips.
Once I select the category how can I avoid to have a link to the selected item of the portfolio ?
In different words, I need to see the thumbnail of the selected category and nothing else, therefore be able to only select a different categories and watch his portfolio items.
Thanks in advance.
Roberto

#10

HI there,

I’m not sure if I understand it correctly, but you mean to stop the filtering functionality? Though, displaying category image isn’t possible, or does it mean different? Please provide more details or perhaps mockup design of what you’re trying to achieve.

Thanks!

#11

Hello Rad, thanks for the answer. I’ll try to explain in a different way. Once on the main portfolio page, http://sjo-hokar.it/insertpwd-ce/home/come-dormivamo/ I use the filtering buttons to show the people that was living together, in the same room. I do not need and I would like to eliminate, inhibit the link to the portfolio item page that you reach once you click on any of the images showed applying the filter.
Hoping I clarified my support request, best regards,

Roberto

#12

Hello There,

Thank you for the clarifications. Since the links are already there, we just have to disable it so that you will only see the portfolio items but will no longer be clickable. Please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.page-template-template-layout-portfolio .entry-title.entry-title-portfolio a,
.page-template-template-layout-portfolio .entry-featured a {
    pointer-events: none;
}

We would loved to know if this has work for you. Thank you.

#13

Sorry for not answering before.

It works perfectly.

Thank you very much.

Roberto

#14

You’re welcome.

#15

Sorry a new problem arise.
I have several different portfolio page and what you suggested that is working fine should be applied to only a specific portfolio and not to the others where should be possible to open the portfolio item page.
Could you provide the solution modifying the CSS that apply only to a specific portfolio ?
Thanks for the help and sorry for the inconvenience.
Best regards,
Roberto

#16

Hey Roberto,

I’m sorry but further customizations from here would be getting into custom development which is outside the scope of our support. To fix your customization issues, you need to seek help from a third party developer.

Thank you for understanding.

#17

I accept the policy but I am not understanding completely.

The similar problems came out few messages before of this same thread and it was kindly solved from Jade.

I just do not have the knowledge to replicate what has been suggested from Jade, to the actual question, without your help.

Best regards,

Roberto

#18

Hi Roberto,

When editing a portfolio item, there is a box called “Portfolio Item Settings”. The first setting called “Custom CSS Classes” allows you to add a custom class that will be present on the body element when that portfolio item is being viewed.

Custom body classes can be used to add custom CSS that only targets elements for that page. For example, if you use this body class my-item, the CSS might look like:

.my-item .entry-title.entry-title-portfolio a,
.my-item .entry-featured a {
    pointer-events: none;
}
#19

Hi Alexander, thanks for the help.

Unfortunately I made some test and if I apply what has been suggested correctly seems not to work.
I modified one portfolio item as suggested and applied the CSS but I can still click on the item and open the relative item page.
For investigation purpose and clarification of the problem attached some screenshot:




Best regards,
Roberto

#20

Hi Roberto,

I am uncertain what you are trying to accomplish at the moment. Do you want to remove the click event on this page?

If so, you will have to add the body class on that page and not here.

But if you want to disable the click event to specific portfolio items in a portfolio index page such as Protetto: Le camerette in 2^ classe, you will have to individually target each element.