Creating an "as Featured in" Logo Bar on Squarespace
Social proof is an essential part of any business strategy. What’s more impressive: you talking about how awesome your products/services are, or someone else literally demonstrating the results that you’ve gotten for them?
Now, we’re not knocking self-promotion, but sometimes, it’s more effective to have someone else do the talking for you and a logo "as featured in" or "social proof" bar is by far one of the easiest ways to showcase this!
You’ve definitely seen this design feature before. Whether it’s through the use of the phrase “as see on” or “featured in…” followed by a string of logos, or an entire page of client logos, this design tactic powerfully demonstrates just how much of a difference you’ve made in the span of a single glance.
Some examples of major brands that have utilized this design technique:
The great thing about Squarespace is that their flexible block-based website builder allows you to replicate this easily and in several different ways. So, if you want to learn how to create a logo/featured bar to build authority, credibility, and trust for your business, then keep on reading!
Compile Your Logos
First and foremost, what makes a logo bar so compelling is that all the images are streamlined. To ensure aesthetic uniformity across the board, here are some quick pointers:
Ensure that all logo sizes are the same. We like to use Canva to create graphics that have the same 650px x 250px dimension. You can of course change the image dimensions to fit your needs and scale the logos so that the texts are relatively the same size.
Using transparent PNG versions of brand logos will make the images fit in more cohesively with your overall branding. When the logos are transparent, the background color of your site will show through and it’ll be easier to place these wherever you’d like without needing to worry about how it fits in with the rest of your website. (Just make sure to tick the “transparent background” box when you’re downloading your image.)
You do need Canva Pro for this feature, but if you don’t have it, you can start a free trial.
Another way to ensure uniformity is to simply place these brand logos against a white background. Or, add a background color to the page in Canva that matches the background color of your site.
Creating a Logo Bar With Just Images (works for both Squarespace 7.0 and Squarespace 7.1)
Creating a logo or feature bar with just images is one of the simplest ways to execute this design feature. Here’s how you would do it!
Navigate to the page where you’d like to build your logo bar and click EDIT in the top left corner.
Hover over the section where you’d like to build your logo bar and click the +ADD BLOCK button
Select IMAGE and drag the block to where you’d like it on the page
Upload your logo image into the block
Then repeat this process to add all of your logos into individual image blocks
Drag and drop the image blocks to reposition them in a line
Click SAVE to apply your changes
Creating a Logo Bar With a Gallery Block in Squarespace 7.0
If you have a Squarespace 7.0 website, another way to create a logo or feature bar is by using the gallery block!
Navigate to the page and area that you’d like to build your logo bar
Click EDIT
Hover over the section and click the + to add a new block
Select GALLERY and drag the block to where you’d like it on the page
Upload your logo images into the CONTENT section of the gallery block
Click APPLY to exit out of the gallery block
Click SAVE to apply your changes
Modify the Gallery Block:
The logos may not be displayed exactly as you want them to be but fret not, here are some simple modifications to make it look better!
Hover over the page and click EDIT to make adjustments
Click the GALLERY block
Click EDIT in the upper right corner
Navigate to the DESIGN tab of the gallery block
Click the GRID format to showcase all the image logos in a single line
Change the ASPECT RATIO to match that of your logos
For 650px x 250p images, select the 2.40 anamorphic widescreen aspect ratio
You can also uncheck CROP IMAGES to display logo images in their original size
Adjust the sliders to decide on the number of thumbnails you’d like on one line and the amount of padding you’d like between each of the images
Click APPLY and SAVE when you’re done with all edits
Creating a Logo Bar With a Gallery Section in Squarespace 7.1
In Squarespace 7.1, you can create a logo or featured bar with a gallery section! Gallery Blocks are only available for Squarespace Circle Members right now.
Navigate to the page and area that you’d like to build your logo bar
Click EDIT
Click the ADD SECTION button that’s displayed on the lower border of the previous section
In the pop up panel, scroll down to Showcases > Images on the left
Select one of the section options which have an ‘i’ in the corner (these indicate gallery sections as opposed to just a regular section built with image blocks). Don’t worry, you can always customize the look of your gallery later so it doesn’t really matter which gallery layout you pick.
Once the section has loaded on your page, hover over it and click EDIT GALLERY in the top right corner.
In the pop up panel, you can select all of the demo images and delete them by clicking on the bin icon.
Then, click the + button at the top of the panel to add your own photos or drag and drop your logo images directly into the panel.
Click CLOSE in the upper left corner to exit out of the gallery
Click DONE in the top left corner to save your changes
Customize the Gallery Section
The logos may not be displayed exactly as you want them to be so here are some ways to modify the display.
Hover over the gallery section and click EDIT SECTION in the top right corner
To create a logo bar, select the gallery type to “Grid: Simple”
Adjust the WIDTH according to how far across the screen you want the logos to appear
Change the ASPECT RATIO to match that of your logos
Match the number of COLUMNS to the amount of logos that you have
Adjust the spacing between images to your liking.
Creating a Scrolling Logo Bar
If you want something a little more eye-catching than a static logo bar, you can also turn your logos into a continuously scrolling marquee!
You will need a bit of custom code to create this but the Animated Scrolling Logos plugin from Schwartz-Edmisten makes this super easy to set up in Squarespace 7.1 and costs just $25. It creates an infinite scrolling row of logos, and you can adjust things like the scrolling speed and logo size to suit your site.
There you have it – how to create a logo or featured bar in Squarespace!
Want more Squarespace tutorials to revamp your site? Check out the posts below 👇
10 fun customisations for your Header Navigation menu in Squarespace
How to create overlapping sections in Squarespace Fluid Engine
How to add a background color to a text block in Squarespace
How to add Parallax in Squarespace 7.1 (and other fun background animations!)
How to create a ‘featured post’ slider in Squarespace 7.1 & 7.0
If you liked this post, Pin it to Pinterest! 👇🏻
