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

Floating Button


JonCho

Question

Hi, 

I'm in the midst of building my site (thus, no URL to share yet) and need a floating button that appears on every page that will take the user to the 'Contact' page. I imagine it would be a phone icon, white on a round black background + 'Reveal' animation.

Is this the right place to request for a CSS code for this?

Thanks!

Link to post
  • Answers 1
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Posts

Hi, Insert this code in your Footer Code Injection. <a href="https://www.ixstudio.net/ninjakit"><div tabindex="0" type="bubble" class="wt_start_inbtn" style=" height: 64px; b

1 answer to this question

Recommended Posts

  • 0

Hi,

Insert this code in your Footer Code Injection.

<a href="https://www.ixstudio.net/ninjakit"><div tabindex="0" type="bubble" class="wt_start_inbtn" style="
    height: 64px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 12px;
    border-radius: 50%;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    cursor: pointer;
    user-select: none;
    position: fixed;
    outline: transparent;
    background-color: #242424;
    right: 20px;
    bottom: 20px;
    width: 64px;
">  <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="phone" class="svg-inline--fa fa-phone fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" style="
    width: 24px;
    color: white;
"><path fill="currentColor" d="M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z"></path></svg>  </div>
</a>

Please use the like button if it helps you!

Best,
Leopold

Ninja Kit Extension: Upgrade your Squarespace website without coding.

YouTube Preview    -    FREE DOWNLOAD

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...