Mobile Portfolio Titles

Shapely
1

I have used the css in the forums for getting the portfolio titles to show without hovering, but it seems it stopped working. I had installed some other plugin related to video, so I deactivated it but the problem remains.

If it is at all possible to get some help with this, that would be great. The issue happens on both the Home Page Portfolio and the Full portfolio.

2

Hello there,

I hope you are doing well today.

You can use the following CSS code to reveal the title by going to Appearance > Customize > Additional CSS and pasting it there.


/*Reveal title*/
.inner-title.hover-reveal .title {
    opacity: 1;
}

Best Regards,
Support

3

Thank you so much for replying. I have been enjoying learning and constructing my site using the Shapely theme.

I had previously added this CSS in:

/Portfolio Titles/
@media (max-width: 890px){
.shapely_home_portfolio .inner-title .hover-reveal .title {
opacity: 1;
top: 30%;
}

I went ahead and added your version as well, but still no change. On PC, I still get the nice hover title effect.

On iPad, it would be great if the Titles would always show without hovering as hovering is not typical activity for a Tablet screen–no mouse pointer.

It seems like some other CSS or code is overruling the custom css – but I am too amateur to figure it out. Any other ideas appreciated!

4

Well I was able to get this to work by editing the CSS to look like this>

/*Portfolio titles for Mobile held Horizontal*/
@media (max-width: 1024px){
 .shapely_home_portfolio .inner-title .title {
    opacity: 1;
		top: 10%;
}
}
/*Portfolio Titles for Mobile held Vertical*/
@media (max-width: 890px){
 .shapely_home_portfolio .inner-title .title {
    opacity: 1;
		top: 30%;
}
}