[colormatters]

What CSS can I to just see blog post title without excerpt when mousing over post on desktop view.
Would it be possible to make the desktop view look like the mobile view where the blog post title is superimposed over image?
Attached image sample from mobile view.

Thanks.

[colormatters]

My screen shot did not work on earlier post so trying again.

https://drive.google.com/file/d/19PWaHKZMq4GU0–opUtmWD_85t48O4Oc/view?usp=sharing

[Theme Horse Support Team]

Hi,

Go to Appearance > Customize > Additional CSS and paste below custom CSS code to make the desktop view look like the mobile view.

.has-post-thumbnail:not(.format-quote) .entry-wrap .entry-main {
	opacity: 1;
	-moz-opacity: 1;
	filter:alpha(opacity=100);
	top: inherit;
	padding: 30px 15px 15px;
	background: transparent;
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8));
	background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8));
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8));
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.4));
}
.has-post-thumbnail:not(.format-quote) .entry-wrap .entry-main p {
	display: none;
}
.has-post-thumbnail .entry-wrap .entry-main .entry-title {
	margin-bottom: 0;
	text-shadow: 0 1px 2px rgba(0,0,0,0.5);
	color: #fff;
}

Thank you for using our theme.

[colormatters]

Sweet.
Thanks for your help.

[Theme Horse Support Team]

Hello,

You are welcome anytime.
If you have any problem than do not hesitate to contact us.

Thank you for using our theme.

[colormatters]

Hi,

Another request in regards to CSS mod for blog post grid view for desktop browser view.
Would it be possible when mousing over in desktop view to just see post title pop on instead of seeing all text from first paragraph.

Thanks.

[Theme Horse Support Team]

Hi @eric1

To pop on the post title instead of seeing all text when mouse over just use below custom CSS code:

.has-post-thumbnail:not(.format-quote) .entry-wrap .entry-main {
	top: inherit;
	padding: 30px 15px 15px;
	background: transparent;
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8));
	background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8));
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.8));
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.4));
}
.has-post-thumbnail:not(.format-quote) .entry-wrap .entry-main p {
	display: none;
}
.has-post-thumbnail .entry-wrap .entry-main .entry-title {
	margin-bottom: 0;
	text-shadow: 0 1px 2px rgba(0,0,0,0.5);
	color: #fff;
}

Thank you!

[colormatters]

Thanks

[Theme Horse Support Team]

Welcome @eric1

[Author]

Posts