Set An SVG File As The Logo | Squarespace Rally Template

Rally Template - Left Aligned Logo

This code only works if you have set a logo as the branding. It WILL NOT work if you just have text as the site title.

/*This is the code that sets an SVG as the logo for a left aligned branding position in Squarespace's Rally template. You can adjust the width with px or percentages to make it the size you want, and adjust the margin, position, and padding to position it where you want.*/

html.svg .Header-inner--top .Header-branding
{width: 250px !important;
display: block;
background-image: url('https://static1.squarespace.com/static/59bddea93e00bee05f906d9a/t/59c730f8be42d656a954e947/1506226424529/Asset+96.svg');
background-repeat: no-repeat;
background-position: center center;
padding-bottom: 7%;
margin-left: 3%;} 

/*This hides the image logo.*/

html.svg .Header-inner--top a img.Header-branding-logo
{display: none;}

/*This is the code that sets the SVG as the logo in the mobile version of your site. You can adjust the width with px or percentages to make it the size you want, and adjust the margin, position, and padding to position it where you want.*/
@media only screen and (max-width: 640px){
html.svg .Mobile-bar.Mobile-bar--top .Mobile-bar-branding
{display: flex;
width: 230px;
background-image: url('https://static1.squarespace.com/static/59bddea93e00bee05f906d9a/t/59c730f8be42d656a954e947/1506226424529/Asset+96.svg'); 
background-repeat: no-repeat;
background-position: center center;
padding-bottom: 13%;}
 /*This hides the image logo on mobile views.*/
html.svg a img.Mobile-bar-branding-logo
{display: none;}}