Docs

[nextstepsyep]

The MyCred plugin is critical to my website operation but it disrupts my recent posts display. When I deactivate it, the posts show accurately. When I activate it, extra white boxes for the recent posts permalinks appear and push everything out of whack. How do I disappear the permalink boxes and keep MyCred active?

http://nextstepsyep.org/operation-restoration/

[Thai]

Hi There,

Could you please send us some screenshots?

Many thanks.

[nextstepsyep]

Hi Thai,

Here’s are screenshots of my webpage with MyCred activated and when MyCred isn’t activated.

[Rupok]

Hi there,

Thanks for writing back. Let’ activate the plugin and update us so that we can inspect and suggest a solution.

Cheers!

[nextstepsyep]

I just activated it again Rupok. Looking forward to a solution.

[Rupok]

Hi there,

Thanks for updating. It seems your plugin is adding extra paragraph tag and it’s breaking the layout.
You can add this under Custom > CSS in the Customizer.

.x-recent-posts a.x-recent-post3 {
  margin-right: 2.66%;
}

That’s not a prominent solution but that’s all I could suggest if you want to use the plugin. It would be a better approach if you add custom class to the Recent Posts element and modify the suggested code with the class.

Cheers!

[nextstepsyep]

Thanks Rupok!

I’ll give that a try. I’ve been tampering with the recent post elements via CSS to fix this but am not sure if what I’ve been using has countered anything.

For example, I lost my Read More links through a CSS code I tried from trolling the X Forums over the years, but I don’t remember which one did it since it fixed my recent posts excerpts issues. Figured I could live with it since the overlay appeared when hovering.

Kinda scared to do any further tampering unless you can look at my CSS codes and point me in the right direction:

}
.x-img {
margin-bottom: 0;
}.entry-wrap {
padding:10px 20px;
}.x-recent-posts a {
border: none !important;
box-shadow: none !important;
}.x-recent-posts .x-recent-posts-date {
font-size: 17px;
}.x-recent-posts .h-recent-posts {
font-size: 22px;
white-space:normal;
}.x-recent-posts .has-post-thumbnail .x-recent-posts-img {
height: 127px;
overflow: hidden;
}
.x-recent-posts-excerpt {
height: 150px;
overflow: hidden;
display: block;
font-size: 17px;
}.x-recent-posts .entry-wrap {
background-color: #fff;
}.x-recent-posts .x-recent-posts-img {
background-size: contain !important;
}.x-recent-posts .x-recent-posts-date {
margin-bottom: 20px;
}.home .entry-wrap {
background: none;
box-shadow: none;
border-radius: 0;
padding: 0px;
}

[nextstepsyep]

Hey Rupok,

The CSS code you provided worked. Thanks!

[Lely]

Hello There,

Glad it is working now. Can you confirm that everything is now sorted out?

[nextstepsyep]

Hi Lely,

I’ve toyed with this page for a couple of days now and still can’t seem to get it right. After I did a new post, a couple of things happened:

1. The recent posts’ first column moved down due to an invisible box that is now over it (according to the f12 thingy).

2. My post requires a featured image but duplicates it in the actual post. I definitely want to show a featured item but not within the post itself. How do I turn that thing off?

Please help.

Page: http://nextstepsyep.org/operation-restoration/

[Rad]

Hi there,

1. The spaces are due to malformed elements (element without closing, and without opening). Please check it here https://validator.w3.org/nu/?doc=http%3A%2F%2Fnextstepsyep.org%2Foperation-restoration%2F

It says about <p> tags. It should always the pair of <p></p> and not just <p>, and just </p>. Please correct your content 🙂

The space is due to that, it’s affected, but the issue doesn’t originate from that exact position.

2. Just set the featured image and don’t insert it within the editor.

Thanks!

[nextstepsyep]

Rad,

You’re totally awesome! Unfortunately, I’m not fluent in your language.

I understand what you’re saying but I have no idea how to fix it. I see the errors when I use the f12 thingy and know that the boxes only appear when I activate MyCred. I used the recent posts shortcode through Visual Composer so I’m not sure what <p></p> codes I did or did not close.

Super lost right now. Is this a CSS thing I need to fix or a functions.php deal?

Can you help?

[Rad]

Hi there,

Let’s start it in this content

<p><span style="color: #000000; font-size: 20px;"><strong>Become A Partner In Education</strong></span><br />
<span style="color: #808080;">NEXT Steps Partners In Education Program establishes lines of communication between students, schools, mentors, volunteers, nonprofits and businesses</span><br />
<i  class="x-icon x-icon-arrow-circle-left" data-x-icon="" aria-hidden="true"></i> <a href="http://nextstepsyep.org/partners-in-education/">Learn more</a></p>
</p>

You have two </p> but only one <p>, and you shouldn’t add <p></p> within another <p></p>, example, this is wrong.

<p>this is a <p>text</p></p>

Fix it like this

<p><span style="color: #000000; font-size: 20px;"><strong>Become A Partner In Education</strong></span><br />
<span style="color: #808080;">NEXT Steps Partners In Education Program establishes lines of communication between students, schools, mentors, volunteers, nonprofits and businesses</span><br />
<i  class="x-icon x-icon-arrow-circle-left" data-x-icon="" aria-hidden="true"></i> <a href="http://nextstepsyep.org/partners-in-education/">Learn more</a></p>

There are many instances of this issue, please fix them and then I’ll check again.

Thanks!

[Author]

Posts