• Creating a page to display content from across multiple sites

    Over the years, I’ve had a range of pages that have contained my content from across several sites. It’s now even easier to create a page using the RSS block, and today I’m going to walk you through that.

    What we will cover today:

    • Creating a page using the RSS block in the editor.
    • Ways to combine that block with others.
    • Styling that block using group block.
    • Using theme.json to create specific styling for that block.
    • Create a page template just for that page and styling it using site editing.

    Creating your page

    To do this, you don’t need to have site editing; I will add some notes of how you can add even more layers using that at the end, though. We are simply going to create a new page in the editor. You can use any theme for this.

    Have your blog links at hand

    Before you dive into this, don’t forget to have your URLs at hand. All your WP sites have a /feed at the end.

    Add the RSS block

    Click to find the RSS block, add it and then type or paste in your URL. Save and there you go – it is as easy as that!

    RSS block

    The next step is to add your URL:

    Adding URL to RSS block

    Congratulations, your content has been added to your site! There are a few options for styling; however, that really is as simple as it starts.

    Block options

    The RSS block has a few options worth noting right there for iterating how it looks:

    • List view or grid view (this shows by the block itself)
    • Set number of items to show (this shows in sidebar).
    • Display on/off: author, date, excerpt (this shows in sidebar).
    • You can also add a classname to the block for targetting styling.

    As you explore these settings, you get others; for example, here is what grid and excerpt reveal:

    Showing options on RSS block

    Styling the block

    If you wanted to style this a bit more, you can wrap everything in a group block, use a header, separator and spacers. The group block then gives you color options for the background.

    Showing a styled post

    Combine with other blocks

    I chose to combine this with the latest posts block on my site, having that at the top. I like the grid layout you can choose for this. By even mixing excerpts or not, you can give a hierarchy to the content. Other blocks like quotes can also divide things up.

    A page with content styled using blocks

    On another page I created for myself, I made an entire list of feeds with headings, all using the same format, with titles showing the type of writing. There are so many options when creating your page.

    Go further and use theme.json

    If you are using a theme with a theme.json you can call the feed block itself and style. Styling this way is incredibly powerful, and you could do something like this:

    Color combinations using theme json

    The code for this is:

    "core/rss":{
    	"color":{
    		"text": "#950E7F"
    	},
    	"typography": {
    		"fontSize": "1.563rem"
    	}
    },

    I did also report today a bug on padding for this block.

    Create a page template

    Why not add a final flourish of having your page template just for this? You could have a particular color background, maybe some specific layout. It’s up to you, but you can easily do that if you have this enabled in your theme.

    To create a page template just for that page, you can click ‘add new’:

    Creating a page template

    Then you will be asked to give it a name; you can style the template however you want.

    A styled page template

    As you are styling, a tip is to keep the list view open; it helps track down things. Also, whilst you can create a new template from the page editor, you can refine a little more using the full site editor – it works better for backgrounds right now. So it’s always worth going into that editor once you set up the template.

    Creating by blocks is powerful

    Creating a collection of content on a page previously took a lot more to do. You would either have had to know development or used a plugin. Now, you can use a block that core provides, and it has styling out of the box ready to go. There are, of course, options, as I’ve shown to go further, but that’s up to you where this block journey takes you. Have fun!

binatethoughts.com

©2024 crafted on WordPress, made by logicalbinary.