How to add a link to a page

From Spiffy Stores Knowledge Base

Jump to: navigation, search

This tutorial shows you how to use HTML to link to a page. If you need to create a link in your menu, please go to How to edit your Store Menus for instructions.

  1. If you're not already logged in to your toolbox, log in and go to the "Pages & blogs" section.
  2. In your store's Toolbox, click on the page you want to edit, and then when the preview page opens, click the small edit link on the left.
  3. Place the cursor where you want the link to be placed on the page.
  4. Type the following, inserting the address for the site you want to link to in place of "webpage.com":
    <a href="http://www.webpage.com">

    This tag indicates the location and name of the link. Be sure to close the tag by using the following tag...
    </a>

    Your link should look like this...
    <a href="http://www.webpage.com">Your link text here</a>


    If you want to make your link open in a new window, you should add the following code to your link...
    target="_blank"

    Your link should now look like this...
    <a href="http://www.webpage.com" target="_blank">Your link text here</a>

  5. Save the page. Now you'll be able to preview the page in your store and test the link you just created.
  6. Click the button in the top right that says "Preview this page". Your page should open up in a new tab, and you should see the link you've created there.
  7. Try clicking on the link. If it does not go to the page you want, verify the address is correct and edit your link to make sure you have created it properly.


How to add a link to a page you've created in your store

  1. If you're not already logged in to your toolbox, log in and go to the "Design & Assets -> Uploaded files" section.
  2. Go to the page you want to link to in your storefront. Copy the address of your page that you can see in the URL bar of your browser.
  3. In your store's Toolbox, go to the page you want to add the link to, and then when the preview page opens, click the small edit link on the left.
  4. Click to place the cursor where you want the link to be placed on the page.
  5. Type the following, inserting the address of the page want to link to in place of "YOUR LINK HERE":
    <a href="YOUR LINK HERE">

    This tag indicates the location and name of the link. Be sure to close the tag by using the following tag...
    </a>

    Your link should look a bit like this...
    <a href="http://www.yourlinkhere.com/pages/yourpage">Your link text here</a>


    If you want to make your link open in a new window, you should add the following code to your link...
    target="_blank"

    Your link should now look a bit like this...
    <a href="http://www.yourlinkhere.com/yourpage" target="_blank">Your link text here</a>

  6. Save the page. Now you'll be able to preview the page in your store and test the link you just created.
  7. Click the button in the top right that says "Preview this page". Your page should open up in a new tab, and you should see the link you've created there.
  8. Try clicking on the link. If it does not go to the page you wanted to link to, verify the address is correct and edit your link to make sure you have created it properly.

How to add a link to a file you've uploaded in your store

  1. If you're not already logged in to your toolbox, log in and go to the "Design & Assets -> Uploaded files" section.
  2. Upload the file you want to link to.
  3. In your store's Toolbox, go to the page you want to add the link to, and then when the preview page opens, click the small edit link on the left.
  4. Place the cursor where you want the link to be placed on the page.
  5. Type the following, inserting the file name of the file you want to link to in place of "your_file_name_here.jpg":
    <a href="/files/your_file_name_here.jpg">

    This tag indicates the location and name of the link. Be sure to close the tag by using the following tag...
    </a>

    Your link should look like this...
    <a href="/files/your_file_name_here.jpg">Your link text here</a>


    If you want to make your link open in a new window, you should add the following code to your link...
    target="_blank"

    Your link should now look like this...
    <a href="/files/your_file_name_here.jpg" target="_blank">Your link text here</a>

  6. Save the page. Now you'll be able to preview the page in your store and test the link you just created.
  7. Click the button in the top right that says "Preview this page". Your page should open up in a new tab, and you should see the link you've created there.
  8. Try clicking on the link. If it does not go to the file you wanted to link to, verify the file name is correct and edit your link to make sure you have created it properly.


How to add a link to an email address

  1. If you're not already logged in to your toolbox, log in and go to the "Pages & blogs" section.
  2. In your store's Toolbox, click on the page you want to edit, and then when the preview page opens, click the small edit link on the left.
  3. Place the cursor where you want the link to be placed on the page.
  4. Type the following, inserting the email address you want to link to in place of both instances of "enquiries@email.com":
    <a href="mailto:enquiries@email.com">enquiries@email.com</a>
  5. Save the page. Now you'll be able to preview the page in your store and test the link you just created.
  6. Click the button in the top right that says "Preview this page". Your page should open up in a new tab, and you should see the link you've created there.
  7. Try clicking on the link. If it does not work properly, verify the address is correct and edit your link to make sure you have created it properly.