Small news feed with image

In working on a newspaper type layout, I needed a basic layout with an image. This is recommend for a 1/3 column or larger. Smaller columns will require font adjustments for the title. When you add this using the post cards element, you must set the number of columns to 1 in order for the layout to work as needed.

This does require custom CSS.

The elements

  • Two nested columns (4/5 and 1/5)
  • Left column
    • Title element
    • Date
  • Right column
    • Background image set to dynamically load the featured image
    • Avada adds a blank image if the column is empty which causes accessibility errors. Add separator with no margin and styling.
    • Custom css (No longer required after 7.6):
Copy to Clipboard
  • September 25, 2022

    Go to Customizing the Off Canvas Background
  • September 25, 2022

    Go to Customizing Toggle (Accordion) Headings
  • September 18, 2022

    Go to Plugin Possibilities – Webyx
  • September 5, 2022

    Go to Remove dots under a required form label
  • September 3, 2022

    Go to Remove RankMath Annoyance

Small news feed

Similar to the previous listing without an image, but intended for smaller columns. I created a card for dark and light backgrounds and slightly different font settings.

The elements

  • Left column
    • Title element
    • Date
  • August 24, 2022

  • August 21, 2022

  • August 27, 2022

  • August 12, 2022

  • August 12, 2022

  • August 27, 2022

Copy to Clipboard
Copy to Clipboard