How to add links to your blog posts
We’ve made it easy for you to add and customize links within your blog posts.
We prepared a video to show you how to do it. You can also follow our written tutorial below this video.
To add a link to your blog post, highlight or double-click the text you want to link and click the link icon from the menu that appears below the selected text.
After clicking the link icon, you’ll see a popup window with the following options:
Add a link to the selected text (you can link to websites, images, and PDFs)
Change the link text, which will be the text you previously highlighted
Select the appropriate “Rel” attribute
Set the link to open in a new tab
This popup window will look familiar if you’ve used DropInBlog’s call-to-action buttons. It offers the same options as those you see when you add a CTA . That’s because a CTA is nothing more than a styled link. You can think of it like just getting dressed (a link) vs. getting all dressed up (a CTA).
Let’s look at the available link options up close.
The URL field is where you’ll add the link to the target website.
Alternatively, you can click the file icon on the right to open the File Manager and set an image or PDF as your link’s destination.
The text field will display the text you highlighted while creating your link. You can change the text in the popup, and it will update in the editor as well after you hit the Update button.
The third field allows you to set a Rel attribute.
You have a variety of options to choose from, as shown in the image below.
These rel attributes are used to communicate with search engines. They explain the relationship between the page where the link is placed (your blog post) and the page or element it is linking to.
None is selected by default. This option is used for internal links when you want to link to other posts on your blog.
The No Follow attribute tells search engines they shouldn’t follow a link and that the page author (you) doesn’t endorse the site this link leads to.
The Sponsored attribute tells search engines that you got paid for placing a link on your site.
The Me attribute is used when the link leads to a source about the page author (you).
The No Opener attribute is used for security reasons. When you set a link to open in a new window, the No Opener attribute ensures that no malicious activities on the linked site can reach your site by removing all connections between your site and the new window that opens.
The No Referrer attribute hides your site as the source that a user came from.
You can also combine two or more attributes (e.g., No Opener, No Referrer) to better inform search engines about the nature of the links on your site.
You also have the option to check the Open in new tab box (for tech enthusiasts and anyone named Jason who spells their name as JSON, that translates to adding the target="_blank" attribute to the URL).
A common practice is to check this box if your link leads to an external website or leave it unchecked if you’re linking to another page on your site such as another post.
Once you add a link to the URL field and select the rel attribute, click Update to apply your link settings. Your link should look like in the image below.
To remove a link, click on it and select the link icon with a line across it.
If you want to customize your site’s links, you do so by visiting Code & Layout → Advanced → Design Customizations .
From here, you can change the color of your links and choose whether or not you want them underlined.
Clicking the Link Color field will open a palette of suggested colors, but you can also add other hex values to get a different link color.
You can also choose if you want to show or hide link underlines.
Click the field below Link Underline , and select the desired option from the dropdown: underline or none .
If you leave the default option, Inherit , all links on your blog will take over the selected underline style of your main website.
Once you’re happy with how your links look, scroll down to the bottom of the section, and click Save Design Customizations to save your changes.
You can now add links to your blog posts, and customize their appearance.
Happy blogging!
We prepared a video to show you how to do it. You can also follow our written tutorial below this video.
Adding links
To add a link to your blog post, highlight or double-click the text you want to link and click the link icon from the menu that appears below the selected text.
Link options
After clicking the link icon, you’ll see a popup window with the following options:
Add a link to the selected text (you can link to websites, images, and PDFs)
Change the link text, which will be the text you previously highlighted
Select the appropriate “Rel” attribute
Set the link to open in a new tab
This popup window will look familiar if you’ve used DropInBlog’s call-to-action buttons. It offers the same options as those you see when you add a CTA . That’s because a CTA is nothing more than a styled link. You can think of it like just getting dressed (a link) vs. getting all dressed up (a CTA).
Let’s look at the available link options up close.
1. Setting your link destination
The URL field is where you’ll add the link to the target website.
Alternatively, you can click the file icon on the right to open the File Manager and set an image or PDF as your link’s destination.
2. Changing your link text
The text field will display the text you highlighted while creating your link. You can change the text in the popup, and it will update in the editor as well after you hit the Update button.
3. Choosing a Rel attribute
The third field allows you to set a Rel attribute.
You have a variety of options to choose from, as shown in the image below.
These rel attributes are used to communicate with search engines. They explain the relationship between the page where the link is placed (your blog post) and the page or element it is linking to.
None is selected by default. This option is used for internal links when you want to link to other posts on your blog.
The No Follow attribute tells search engines they shouldn’t follow a link and that the page author (you) doesn’t endorse the site this link leads to.
The Sponsored attribute tells search engines that you got paid for placing a link on your site.
The Me attribute is used when the link leads to a source about the page author (you).
The No Opener attribute is used for security reasons. When you set a link to open in a new window, the No Opener attribute ensures that no malicious activities on the linked site can reach your site by removing all connections between your site and the new window that opens.
The No Referrer attribute hides your site as the source that a user came from.
You can also combine two or more attributes (e.g., No Opener, No Referrer) to better inform search engines about the nature of the links on your site.
4. Opening links in a new tab
You also have the option to check the Open in new tab box (for tech enthusiasts and anyone named Jason who spells their name as JSON, that translates to adding the target="_blank" attribute to the URL).
A common practice is to check this box if your link leads to an external website or leave it unchecked if you’re linking to another page on your site such as another post.
Once you add a link to the URL field and select the rel attribute, click Update to apply your link settings. Your link should look like in the image below.
Removing links
To remove a link, click on it and select the link icon with a line across it.
Styling links
If you want to customize your site’s links, you do so by visiting Code & Layout → Advanced → Design Customizations .
From here, you can change the color of your links and choose whether or not you want them underlined.
Clicking the Link Color field will open a palette of suggested colors, but you can also add other hex values to get a different link color.
You can also choose if you want to show or hide link underlines.
Click the field below Link Underline , and select the desired option from the dropdown: underline or none .
If you leave the default option, Inherit , all links on your blog will take over the selected underline style of your main website.
Once you’re happy with how your links look, scroll down to the bottom of the section, and click Save Design Customizations to save your changes.
You can now add links to your blog posts, and customize their appearance.
Happy blogging!
Updated on: 05/11/2024
Thank you!