Support » Plugin: WordPress Popular Posts » Use plugin on homepage

  • Resolved cmnthrds

    (@cmnthrds)


    I’m trying to use this plug in on the home page, but can’t get it to display properly.

    What I’d like to do is have it display like the “recent” posts area above it.

    I can’t get it to be appear in a 2×3 grid with titles underneath, or even just a 2×3 grid with images.

    I also use the plug in on my side bar with different settings, and I think we’re running into issues with two different uses of the plug in.

    From my developer: Popular Posts – this section is a problem for the home page. I got the plugin to display but I can’t get the posts to display in a grid or columns. I can make columns but if I duplicate the plugin widget there is no way to instruct the new widget to not duplicate.

    Thanks for any help or insights you might be able to extend to us!

    • This topic was modified 5 years, 1 month ago by cmnthrds.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author Hector Cabrera

    (@hcabrera)

    Hi @cmnthrds,

    I happened to read this by chance from my phone. It’s a bit late over here now, I’ll lend you guys a hand sometime tomorrow.

    I also use the plug in on my side bar with different settings, and I think we’re running into issues with two different uses of the plug in.

    The plugin is very flexible, I can tell you that much. You can have two (or more) Popular Posts widgets each with its own design/structure. What your developer said is simply not true.

    I’ll need some more details in order to help you out but let’s discuss that tomorrow.

    Plugin Author Hector Cabrera

    (@hcabrera)

    Hey @cmnthrds,

    You mentioned that you guys were using the WPP widget. However, from the source code of your homepage it seems you’re using a Page Builder. Is that correct?

    Thread Starter cmnthrds

    (@cmnthrds)

    Yes. We’re using a page building with the widget. I have a developer who I’m working with and I’m not 100% sure how it all works.

    We got the plug in to appear as a grid and it’s almost as we want it.

    It’s not responding on mobile appropriately. It turns into one column, but it’s way off center and off the screen on the right.

    On desktop, I’d like a bit more room in between all the images, as well.

    Plugin Author Hector Cabrera

    (@hcabrera)

    Yes. We’re using a page building with the widget.

    That’s what I thought. Which one are you using? I could try installing it on my development site and see how it works.

    Could you please share a screenshot of the settings you’re using on the homepage?

    It’s not responding on mobile appropriately. It turns into one column, but it’s way off center and off the screen on the right.

    On desktop, I’d like a bit more room in between all the images, as well.

    These are all styling issues. Your developer should look into this.

    Alternatively, if you’re up for it and don’t feel like waiting, I’m available for freelance work.

    Thread Starter cmnthrds

    (@cmnthrds)

    Plugin Author Hector Cabrera

    (@hcabrera)

    Seeing how Beaver Builder renders the WPP widget settings form hurts my feelings a little…

    Anyways, you can have that WPP widget use almost the exact same structure as your Recent Posts grid. To do so:

    1. Under HTML Markup Settings, set Before/after Popular Posts to <div> and </div> respectively.
    2. Set Post HTML Markup to:
      
      <article class="simple-grid one-third post type-post status-publish format-standard has-post-thumbnail entry">
          <a href="{url}" title="{text_title}" class="alignnone">
              {thumb_img}
          </a>
          <header class="entry-header">
              <h2 class="entry-title">
                  <a href="{url}">{text_title}</a>
              </h2>
          </header>
      </article>
      
    3. Click on Save to apply changes.

    With this, the popular posts grid is almost ready. You/your developer will still need to make some tweaks to the CSS rules for the grid to look and behave exactly like your Recent Posts list (eg. target the first element on each row via CSS rules since we can’t assign the odd class to it, at least not without using some PHP).

    You may need to adjust the CSS classes assigned to the article element as well.

    Thread Starter cmnthrds

    (@cmnthrds)

    Almost got it! The mobile display is much better.

    It made it a 3×2 grid not a 2×3 grid. I assume that’s some work with CSS?

    Plugin Author Hector Cabrera

    (@hcabrera)

    Yep! Just got your e-mail though, let’s move the conversation over there 🙂

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Use plugin on homepage’ is closed to new replies.