create account

Customizing feed links in the WordPress header by vladimir-simovic

View this thread on: hive.blog |  peakd.com |  ecency.com
wordpress · @vladimir-simovic ·
$25.01
Customizing feed links in the WordPress header
In this tutorial I explain how to customize the feed links that WordPress automatically generates in the header-section (`<head>`) to help the visitor on the one hand and to make the links more eye-catching and on the other hand to increase the click-through rate. This is especially interesting if you also offer podcast feeds.

![](https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1510576636/knehb3mdymeserujgyab.png)
[The result: individualized feed links in WordPress]

## What is this about?

In a standard installation WordPress generates up to three links in the `<head>`, i.e. in the source code of the header line, using the link element. These refer to the three feeds:

- main RSS feed
- comment feed
- RSS feed of the corresponding archive: category, keyword etc.

This is what it looks like on the start page of a standard installation with Firefox:

![](https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1510576186/lyvvopglfmcgxcgckywa.png)

The first two links - which can also be seen in the screenshot - also appear on the start page, the RSS feeds of the archives only appear on the appropriate subpage. You will find the entries in the source code if you search for the following sections:

`<link rel="alternate" type="application/rss+xml"`

## The "problem"

But two things bothered me here... or better said, they were not optimal in my eyes and therefore I wanted to adapt them.

On the one hand I wanted to make the browser and the podcatcher (software with which you can subscribe to podcasts) aware of the podcast feed on the start page and with the help of graphics or icons I wanted to loosen the whole thing up a bit and thus also make it more user-friendly.

## The solution

First I disabled the automatic output of feed references with the following code fragment in the functions.php of the theme:

    // remove feed links in header
    remove_action('wp_head', 'feed_links', 2 );
    remove_action('wp_head', 'feed_links_extra', 3 );

Then I extended the header.php and entered the following shortly before `</head>`:

    <link rel="alternate" type="application/rss+xml" title="perun.net &raquo; Feed der Blogartikel &#128240;" href="https://www.perun.net/feed/" />
    <link rel="alternate" type="application/rss+xml" title="perun.net &raquo; Kommentar-Feed &#128172;" href="https://www.perun.net/comments/feed/" />
    <link rel="alternate" type="application/rss+xml" title="WordPress &amp; Webwork Podcast &#127911;" href="https://www.perun.net/podcast/feed/" />

Now, when I access my professional website with a podcatcher, it looks like the first picture. This figure shows the call of AntennaPod on Android 7 and here follows the view in the current Firefox (left) and the current version of Opera (right):

![](https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1510577111/kn6xv3hwhwnglj4y7goe.png)

Let us now come to the code that is responsible for this. The whole secret lies in the content of the title attribute. There you can not only place simple text but also symbols and icons. For example, `&raquo;` becomes **ยป**, `&#128240;` becomes ๐Ÿ“ฐ, `&#128172;` becomes ๐Ÿ’ฌ, `&#127911;` becomes ๐ŸŽง etc.

These and other symbols can be found on the following two websites, among others:

- [Unicode Character Search](http://www.fileformat.info/info/unicode/char/search.htm)
- [Graphemica](http://graphemica.com/unicode/characters)

The purpose of all this is to focus on certain RSS feeds and to help visitors find their way around. Therefore, one should take a moderate approach here as well. That means: don't include dozens of feed links and also don't include all icons which are not cleared out in a minute. ๐Ÿ˜€
๐Ÿ‘  , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , and 68 others
properties (23)
authorvladimir-simovic
permlinkcustomizing-feed-links-in-the-wordpress-header
categorywordpress
json_metadata{"community":"busy","app":"busy/2.5.6","format":"markdown","tags":["wordpress","busy","web","rss","tutorial"],"users":[],"links":["http://www.fileformat.info/info/unicode/char/search.htm","http://graphemica.com/unicode/characters"],"image":["https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1510576636/knehb3mdymeserujgyab.png","https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1510576186/lyvvopglfmcgxcgckywa.png","https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1510577111/kn6xv3hwhwnglj4y7goe.png"]}
created2018-08-24 14:36:36
last_update2018-08-24 14:36:36
depth0
children0
last_payout2018-08-31 14:36:36
cashout_time1969-12-31 23:59:59
total_payout_value19.382 HBD
curator_payout_value5.625 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length3,748
author_reputation56,930,790,558,862
root_title"Customizing feed links in the WordPress header"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id69,233,777
net_rshares17,010,316,339,890
author_curate_reward""
vote details (132)
Help/Feedback