Hi! Here I am again with a super fun Home Assistant tutorial. What if you want to show the latest news items from your favorite website on your Home Assistant dashboard? With this tutorial, you can do that yourself! Let’s do this!
โญโญโญ NOTE: โญโญโญ
This article accompanies a YouTube video. I wrote it for people who would rather read than watch a video. To continue doing this, please check out the video, comment under it, give it a thumbs up, andย subscribe to my YouTube channel. This will ensure that the video is offered more often to new visitors so that they can stay informed of the latest Home Assistant tutorials and smart home-related product reviews.
I appreciate your support!
Ed
Click here to watch the video
Do you remember this video? In it, I explained how to display the latest news article on your dashboard or your Ulanzi Desktop Clock. This is very useful if you just want to see the latest update! However, several people asked me if it’s also possible to show a complete news overview on the Home Assistant dashboard. And yes, thatโs possible, too! But it works a bit differently.
We will set up a Trigger-Based Template in Home Assistant to create this overview. This means weโll be working with YAML again. If you want to learn more about YAML and programming in Jinja, check out my free YAML and Jinja course, which I created earlier. It will help you understand how templates work in Home Assistant much more easily.
Alright, letโs get started!
Installing the Feedreader Integration
To begin with, we need to install the Feedreader Integration in Home Assistant. This integration ensures that your news articles are fetched.
- Go To Settings > Devices and Services.
- Click Add Integration.
- Search Feedreader.
- Enter the URL of the RSS feed you want to followโfor instance, the newsfeed from the BBC. If a website provides an RSS-feed, you can find the URL of that feed on your specific site. Be aware that some feeds may not work with this integration. It’s a matter of trying to see what feed works for you.
- Click Submit.
- Select an area for your feed.
- Click Finish.
- You must add the feedreader integration for each feed you want to follow. I have already added some feeds on my system.
- After you’ve added the feed, click the configure button. You can change the number of news items retrieved from the feed. I put mine to 5.
- Click Submit and Click Finish.
The feedreader integration is now installed. Next, we need to create a custom template sensor in Home Assistant.I have already shown how to do this in other videos, but I’ll show it again here.
Install Studio Code Server
First of all, you need a text editor. The best editor to use is Visual Studio Code. You can install it via the add-on store in Home Assistant. However, remember that the add-on store is only available if Home Assistant OS is installed.
- Go to Settings.
- Go to Add-ons.
- Click Add-on Store.
- Search Studio Code Server.
- Click Studio Code Server.
- Click Install.
- After installation, turn on all the toggle switches if you like and click Start.
Studio Code Server is now installed. In the next step, we will add our custom sensor, which will contain the data from our RSS feed.
Adding the RSS Feed Sensor
- Click Studio Code server.
- I changed its look so that it has a dark theme.
- Now, we have to add a line to our configuration.yaml.
- Open the configuration.yaml file.
- And add the following line: template: !include templates.yaml. If you have added this line before, you can skip this step.
- After that, we must create a new file named templates.yaml. If you have already made this file, you can skip this step.
- Click the new File icon and create the file templates.yaml.
- Open the templates.yaml file. In my case, it already contains code, but it will be empty when you create a new file.
We will now add the code to create a sensor containing the RSS feed data. This sensor will store the last five news items from all the RSS feeds that I defined combined. You can adapt the code to contain more news items if you like.
First, we need to know which fields we can use on our dashboard from the news feed. You can check this by looking at the news feed’s URL, but you can also view it in Home Assistant. I’ll show you how.
- Open two browser windows.
- In the first window, open the Developer Tools.
- Click the Events Tab.
- Enter “feedreader” in the Listen to Events field.
- Click Start Listening
- Now go to your second Browser Window.
- Go to Settings > Devices and Services and open the feedreader integration.
- Click the three dots next to the feed that you want to check.
- Click “Reload”.
- If new news items are available, you will see the result in the Listening field in the Developer Tools. As you can see, I didn’t have new news items for a few feeds, but the Home Assistant feed shows a new one for me.
- You will see the item names here. I will use the item “title” and “link.” They are part of the item “data”, so I will use “data.title” and “data.link” later on. You can use the other items yourself if you like.
This is also a great way to check if your news feed is working once you’ve finished creating your dashboard card.
I’ve pasted the code into templates.yaml and will explain what exactly happens line by line. You can manually copy the code from the screen for free, but if you want to save time, you can sponsor me with a small contribution and download the code instead. This way, you can copy and paste it yourself. Your support helps me continue making these tutorials. The link is in the description of this video. Thanks in advance for your support!
Anyway, let’s get started. First, I define an event trigger for the feedreader integration we just installed. When one of your RSS feed sources publishes a new article, this event gets triggered, and the sensor we define below will be updated.
Then, within the action section, I define some variables. The first two variables contain the existing lists of titles and links of my RSS feed items sensor. The second two variables contain the title and link returned by the event trigger. There are multiple ways to do this, but I like to define variables and show how variables can be used in a trigger-based template.
The sensor is named RSS Feed Items, which will also be the entity ID in Home Assistant. Then, I define a unique ID. This isnโt required, but itโs useful if you want to make small changes to the sensor later in Home Assistant. You can generate this unique_id by right-clicking and selecting Generate UUID At Cursor.
Iโve chosen a newspaper icon for the sensor and set the last refresh date for its status. Since the status can only contain 255 characters, I donโt use it to store news articles; instead, I store the articles in the sensor’s attributes, which can contain more data.
Filling the attributes
Within the attributes, I created two listsโone for the titles and one for the links to the articles.
I start by checking whether the list variable is empty. If youโve just created this template, the list is empty, so I check whether its value is None. If it is, I define an empty list.
Now, I will check if the item is already on the list. During my tests, I discovered that sometimes the same item is retrieved by the RSS feedreader integration, so I want to prevent double entries from showing up in my news list. I proceed with the following code if it is not on the list.
I populated the list with the newly retrieved news item and appended the existing news items to it. Finally, I return the first 5 items in the rss_titles variable so that the attribute named titles is populated with this list.
For the links, I follow the same process as with the titles, but instead of using the title item, I use the link item.
Now, save the templates.yaml file. Then, go to Developer Tools, scroll down to the YAML tab, and click Template Entities to apply the changes from your templates.yaml file in Home Assistant.
We can now test whether our new sensor exists and whether it contains a value.
- Go to the States tab.
- Search for RSS feed items.
- Click RSS feed items.
You’ll likely see that it doesn’t contain any values yet. Typically, the values are populated once the news feed you’ve configured receives a new article, which sometimes takes a few hours. So don’t worry if there are no values yetโyou must be patient.
However, as I showed earlier in this video, you can speed up the process byย reloading the news feed.
Building the Dashboard card for your news items
Our new sensor, RSS Feed Items, is now being populated, and we want to display it on our dashboard.
- Open one of your dashboard views
- Click the pencil in the right upper corner.
- Add a new section.
- You can remove the header of this section if you like.
- Click the Plus icon to add a new card.
- Search the Markdown card.
- Click the Markdown card.
- Enter a title, like News.
- Add the following code.
- I first define two variables, titles and links, which I fill out with our created sensors’ attribute titles and links.
- Then I loop through all the titles, and for each title, I show the title with a link underneath in a list in heading3 format.
- Ultimately, I show the last refreshed time in a smaller format.
- Click Save.
- Click Done.
This code is also in the download link in the video’s description.
And your news overview is ready!
Bonus: Create an automation to speed up the retrieval of news items
Now it’s waiting for your newsfeeds to contain new articles and for the Home Assistant feedreader integration to fetch them before you see them on your dashboard. This can sometimes take a while, but you can create an automation that checks, for example, every 15 minutes if there are new news articles. I’m unsure if this poses a risk of you being banned by the news site you’re trying this with, so be careful not to fetch your news too frequently. The automation looks like this:
In the ‘When’ section, the time pattern trigger goes off every 15 minutes. In the ‘Then Do’ section, I added a ‘Reload Config Entry’ action and selected the entities, in my case, the events for BBC News and CNN.com.
This automation is triggered every 15 minutes and checks if there are new articles.
So, now you know how to display a newsfeed on your dashboard. I hope this has been helpful and that you’ll enjoy it. Let me know in the comments! You can support me by sponsoring me monthly, just like these people, if my videos save you time and frustration. I appreciate any help you can provide. Youโll find links to the code and instructions on sponsoring me in the video description. And don’t forget to give this video a thumbs up, subscribe to my channel, and leave a comment. I’ll see you soon!
Bye Bye!