Showing posts with label Posts - Hyperlinks. Show all posts
Showing posts with label Posts - Hyperlinks. Show all posts

Create Hyperlink to Open in New Window

When you add a link, or hyperlink, in a blog post to an external site, readers will leave your blog when they click on the link. If a visitor leaves your site, they may not return.


Therefore, some think it's a good idea to change the HTML for the link to specify that you want the link to open in a new browser tab. Others disagree on this tactic, but here are instructions for opening a link in a new browser tab or window.

When creating a new post with the modern templates, you can choose one of two modes: Compose and Edit HTML. To create a link from Compose mode, you first type the "clickable" text you want displayed in your post, then highlight it, click the "Insert Link" icon, and enter the URL address.

If you click the "Edit HTML" tab and look at the hyperlink, it has the following syntax. We will use a link to this tutorial website for an example:

<a href="https://www.keynotesupport.com">The Keynote Support website</a>

The hyperlink is wrapped with the HTML anchor tag. It begins with <a> and ends with </a>. Let's take the mystery out of the HTML for a hyperlink so you will feel comfortable editing it.

Notice that the opening anchor tag, <a> has a lot of verbiage between the "a" and the >. That is because the link address is specified here. It begins with the href attribute and is followed, in quotation marks, by the actual URL address which, in our example, is: "https://www.keynotesupport.com"

Then you will notice the text right before the </a> tag. This is the "clickable" text that you typed in Compose mode. This text displays in your blog post in a different color and may also be underlined - depending on your template.

To tell Blogger to open a link in a new window, you have to add target="_blank" to the HTML. If we added the target attribute to our example link, it would look like the following:

<a href="https://www.keynotesupport.com" target="_blank">The Keynote Support website</a>

So, to make a link to an external site open in a new window:
  1. Get into Blogger and edit the post.
  2. Click the "Edit HTML" tab and find your hyperlink.
  3. Insert your cursor right after the closing quotation mark of the URL address and, after pressing the space bar, type the following: target="_blank"
  4. Click Preview. Now click the link. If you edited the link successfully, Blogger will open the link in a new window. If you did not edit the link successfully, you will either get an error message or Blogger will ask "Are you sure you want to navigate away from this page?" Click Cancel and fix your editing error.

Create a Hyperlink in a Blog Post

It is very helpful to be able to link or hyperlink to another one of your blog posts or to an external site. Follow the instructions below using Compose mode.
  • Type the text that you want hyperlinked. In other words, type the text that you want the visitor to click on to get to the other post or site. For example, if you wanted to link to our blog, you could type The Blog Help Guide.
  • Next, highlight the text you typed and click the Link icon from the top toolbar.
  • A little box pops up asking you to enter the URL. Position your cursor after the pre-filled http:// and type the rest of the URL. For example, if you were linking to our blog, you would type blog-help-guide.blogspot.com.
  • An easy way to enter the URL is to open the blog or website in a separate browser window, right-click in the URL box at the top of the window, and click Copy. Then, return to the little URL box in your blog, delete the prefilled http://, right-click in the empty box, and click Paste.

    • If you are creating a link to another post in your blog, you'll need to click on the actual blog post in order to see the correct address in the URL box at the top of your browser window.
    • If you are creating a link to an external site, follow the directions above, but consider instructing Blogger to open the link in a different browser window so the visitor won't leave your blog altogether. See our blog Create Hyperlink to Open in New Window.

  • Once the complete URL is in the box, click OK.
  • Now click Preview. The text you typed will be a different color and possibly underlined. If you hover your cursor over the hyperlinked text and look in the bottom left corner of your browser window, you will see the URL.
  • After publishing your blog post, test the hyperlink to make sure it works.