Docs

[mbecker908]

I’ve attached a screenshot (WMU Archive) and it shows the archive page with the featured image, and a text snippet from the post. It also has the post tags at the bottom.

What I want to do is be able to build a page formatted like the archive only without the tags, or simply remove the tags from the posts in the archive.

Thank you

[mbecker908]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for writing in! To resolve your issue, removing the tags in the archive pages, please update your code and use the following css code in the customizer, Appearance > Customize > Custom > CSS

@media (min-width: 980px){
  .archive .has-post-thumbnail .entry-featured {
    float: left;
    max-width: 33%;
    margin: 20px;
  }

  .archive .has-post-thumbnail .entry-footer {
    display: none;
  }
}

Hope this helps. Please let us know how it goes.

[mbecker908]

That’s not really getting me what I’m looking for.

What would I need to do to set up a Page using a Recent Posts element, dropping the posts down vertically and showing the Featured Image (All FIs are 200px X 200px so I don’t think I need to code the size into the CSS, just left justify it) and have the post title with the “Post Snippet” from Yoast SEO.

I’d put it on a page like this… wementoryou.org/got-stress/

Thanks again.

[mbecker908]

Another option would be to use the Recent Posts element similar to the one I have on the Home Page (see attached) with the title added to the element. Justify the FI left and add the Post Snippet to the right.

I’d do the RP element 10 posts vertical.

[Nabeel A]

Hi again,

Can you please setup the page with Recent Posts and let us know so we can take a look? You can setup the page with vertical orientation of Recent Posts and then add the following CSS in your Customizer:

.x-recent-posts .x-recent-posts-content {
    float: left !important;
}
.x-recent-posts .x-recent-posts-img {
    width: 50% !important;
    float: left !important;
    margin-right: 15px !important;
}

Hope this helps!

[mbecker908]

The attachment “Customizer” shows the code in the CSS customizer. I changed the “width: 50%” to “width: 200px since that’s the size of the Featured Image.

The attachment “Got Stress 1.jpg” shows the page with the Recent Posts imbedded in a Text element. It’s set up with the same coding as on the front page except I changed horizontal to vertical and set it for four posts.

Below the text box is a Recent Posts set up by itself, with no text box.

Thanks for your help, this is really stressing me out. 🙂

[Rad]

Hi there,

You shouldn’t apply static width, it will not respond on other devices. Why 200px? Its width is different on larger device and 200px looks smaller.

How about this

.x-recent-posts .x-recent-posts-img {
    width: 100%;
    float: left!important;
    margin-right: 15px!important;
    padding-bottom: 150%;
}

And please provide a mockup design of how it should be displayed.

Thanks!

[mbecker908]

I changed the 200px width to 50% as you had it in the first place, that is attachment Got Stress 1a.

Got stress 2 is the above at 100% and Post Example 1 is what I want it to look like. I don’t want the posts to take up half the screen which is what the archive looks like and I’d like to get the Yoast SEO snippet as the post snippet not whatever the archive is using.

I’d prefer to be able to do this on a page separate from the archive page because I’d like to put additional elements on the page.

Thanks again.

[Joao]

Hello There,

Please upload the other 2 pictures that did not uplaod in order that we can understand your issue better.

The images need to be up to 500kb

Thanks

Joao

[mbecker908]

Here they are. Sorry about that.

[Rad]

Hi there,

Ah, you mean you wish to convert recent posts element to look like standard blog entries (row based layout). Before I continue, I like to clarify what’s the connection of archive pages on recent posts element? It’s been discussed here but I’m a bit confused. They are a different entity, customization done in archive page will not affect recent posts element and vice versa.

If there is no connection, then please remove all the mentioned CSS above and let’s start fresh one and specific to recent posts element.

Thanks!

[Author]

Posts