Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Opening an external link in a new window in markdown


spotonlynne

Question

Site URL: https://www.roadsafetytrust.org.uk

Hi.

I am not a coder at all and have never used markdown until today (but have produced quite a lot of Squarespace sites). What I would like to know is if anyone has found a way to make external links open in a new window when using markdown? I wanted to produce a list of FAQs that you click on the title to expand. I thought I had found the solution, until I tested the page. See: www.roadsafetytrust.org.uk/faqs-md

If anyone has a solution, I would be really, really grateful. Even if it means buying a plug-in.

Thank you!

Lynne

Link to post
  • Answers 8
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Hi Lynne You can add HTML to Markdown Blocks, so instead of using the link button, you can simply add the HTML. For example: <a href="www.squarespace.com" target="_blank">Squarespace&lt

@chrisp14 You're so close to having 100% HTML I suggest you use a code block set to HTML and add the following. <style>   .expertise-list {        font-size: 2em;     font-weight: 600;

Hi @spotonlynne We made a cool FREE extension for FAQ. It works like SQSP other elements. You don't need code knowledge! And you don't need HTML Code block or Markdown or .... Just see this

Posted Images

8 answers to this question

Recommended Posts

  • 0

Hi @spotonlynne

We made a cool FREE extension for FAQ. It works like SQSP other elements. You don't need code knowledge! And you don't need HTML Code block or Markdown or ....

Just see this video and install from here.

 

 

4.thumb.jpg.c77fd53f4ee20acf1681bbdfe21c5aff.jpg

 

If you need more customization feel free to contact me via DM or Skype: LeopoldJobs.

Best,
Leopold

Edited by IXStudio

Ninja Kit Extension: Upgrade your Squarespace website without coding.

YouTube Preview    -    FREE DOWNLOAD

Link to post
  • 0
30 minutes ago, spotonlynne said:

What I would like to know is if anyone has found a way to make external links open in a new window when using markdown?

Hi Lynne

You can add HTML to Markdown Blocks, so instead of using the link button, you can simply add the HTML. For example:

<a href="www.squarespace.com" target="_blank">Squarespace</a>

Change the url and description to match your needs. 

Note that this will open a new “browsing context”. This usually means "new tab" instead of "new window", but it will depend on the visitor’s browser settings. You have no influence over that.

-Paul

sf-digital-signature-logo-email145.png.46606a2288a2847f44d81b9b7b58f3a5.png
Hi, I'm Paul, founder of SF Digitalbuilding the features that Squarespace didn't include. Pick dates in any format, show prices in other currencies, take orders without payment or improve your cartI value honesty, integrity, transparency and respect. Links in my posts may refer to SF Digital products or may be affiliate links.  Squarespace. I've been a loyal supporter of the platform since 2007. 

Link to post
  • 0

You can also use the Accordion Plugin from sqspthemes.  (affiliate link)

With this plugin you can use the Text Block for Accordion Content, so you will insert the link with the customization that opens in a new window.

Link to post
  • 0
On 9/12/2020 at 7:42 AM, paul2009 said:

Hi Lynne

You can add HTML to Markdown Blocks, so instead of using the link button, you can simply add the HTML. For example:




<a href="www.squarespace.com" target="_blank">Squarespace</a>

Change the url and description to match your needs. 

Note that this will open a new “browsing context”. This usually means "new tab" instead of "new window", but it will depend on the visitor’s browser settings. You have no influence over that.

-Paul

 

Site URL: https://www.chrispcreations.com/about

I'm running into a similar issue. I am able to use the link button within the Markdown block to add an external link but can't get it to open in a new tab/window. I tried plugging your HTML snippet in but must not be doing it correctly because it's not working—any advice?

Screen Shot 2020-12-21 at 1.03.28 AM.png

Edited by chrisp14
Link to post
  • 0
On 12/21/2020 at 2:07 PM, chrisp14 said:

I'm running into a similar issue. I am able to use the link button within the Markdown block to add an external link but can't get it to open in a new tab/window. I tried plugging your HTML snippet in but must not be doing it correctly because it's not working—any advice?

Screen Shot 2020-12-21 at 1.03.28 AM.png

Can you share link to page where you use Markdown? We can help easier

Link to post
  • 0

@chrisp14

You're so close to having 100% HTML I suggest you use a code block set to HTML and add the following.

<style>

  .expertise-list {
  
    font-size: 2em;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3em;
    list-style-type: none; /* remove bullets */
    margin: 0; /* remove margins */
    padding: 0; /* remove padding */
    
    }
    
  .expertise-list a {
  
    font-size: 0.5em;
    
    }
    
  </style>

<p>

  Areas of Expertise
  
  </p>

<ul class="expertise-list">

  <li>
  
    Art Direction
    
    </li>
    
  <li>
  
    Motion Design
    
    <a href="http://chrispcreations.com/motion-reel" target="_blank">
    
      → REEL</a>
      
    </li>
    
  <li>
  
    Visual Effects
    
    <a href="http://chrispcreations.com/vfx-reel" target="_blank">
    
      → REEL</a>
      
    </li>
    
  </ul>

Test this first before you delete your current code block. Basically we use an unordered list and create our own class to reduce some of the redundant styling.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to post
  • 0
18 hours ago, creedon said:

@chrisp14

You're so close to having 100% HTML I suggest you use a code block set to HTML and add the following.



<style>

  .expertise-list {
  
    font-size: 2em;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3em;
    list-style-type: none; /* remove bullets */
    margin: 0; /* remove margins */
    padding: 0; /* remove padding */
    
    }
    
  .expertise-list a {
  
    font-size: 0.5em;
    
    }
    
  </style>

<p>

  Areas of Expertise
  
  </p>

<ul class="expertise-list">

  <li>
  
    Art Direction
    
    </li>
    
  <li>
  
    Motion Design
    
    <a href="http://chrispcreations.com/motion-reel" target="_blank">
    
      → REEL</a>
      
    </li>
    
  <li>
  
    Visual Effects
    
    <a href="http://chrispcreations.com/vfx-reel" target="_blank">
    
      → REEL</a>
      
    </li>
    
  </ul>

Test this first before you delete your current code block. Basically we use an unordered list and create our own class to reduce some of the redundant styling.

Let us know how it goes.

Thank you creedon! I plugged that in to a code block and it works like a charm. Made a few more adjustments to get the spacing and color correct. Thanks again for your help.

 

Edited by chrisp14
Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...