Resolve

A collaborative online community that brings together photographers and creative professionals of every kind to find ways to keep photography relevant, respected, and profitable.

Have an idea for a post?

Want us to find an answer to your question? Interested in becoming a contributor?Email us

‹ Home

September 13th, 2018

How to Add Borders to Your Website Images

Posted by liveBooks

Your website is the online extension of your brand, and as such, it should follow the same visual guidelines as your entire business. While your logo is your own trademark that distinguishes your brand from your competitors, it alone does not tell your business’ story, its values nor does it depict the entire picture.

The tone of your business voice is an important aspect of how your market relates to you. Your marketing campaigns and how you choose to run them are indicative of your business’ core values. The fonts you use when addressing these messages can become trademarks of your brand. And the colors – think about the Coca-Cola red – not only is it unique, it’s also recognized by millions of people all around the world.

Colors matter when you create your brand, just as much as they do when they accompany your services and products. It is the fastest way to create a connection between your brand and your audience. This precise reason is why the liveBooks website templates can be customized beyond their initial state.

Let’s focus on adding borders to the images you upload on your website. These borders are a great tool to use that give each image its own presence on your website. They can be white and thin, which goes well with any website that has a color background, they can be colorful and bold, or anywhere in between.

There are two ways you can go about to adding borders to your images.

  1. Sitewide borders – In your design editor go to Sitewide – Images. Enable Show borders and define their color, opacity and width. This will add borders to all images on your website. 
  2. Gallery borders – In the design editor go to the page with the gallery or image you want to customize. Scroll down to the image settings and enable borders.

If you added site-wide borders and want to disable them on specific pages, you can do so by following the second set of commands. When you’re happy with the result, publish your page and the changes will instantly become visible.

When changing your colors you have to make sure you’re picking the right one. Going solely on visual similarity does not guarantee you’ve made the right choice and you need consistency in your brand. One reason you might not pick the right color is your monitor’s colors: sometimes it’s calibrated and it shows the precise colors you need, but most often it’s not.

That’s why you need to check the HEX code of your brand colors and add it when using the design editor. If you know the name of your color, you can find its HEX code here. In our design editor you can either use the HEX code, or the RGB (red-green-blue) inputs for your colors.

So what are you waiting for? Give this feature a try! Remember, you can always save your design before making drastic changes to your website, so your work is always safe.

Don’t have a website yet? We offer a two week free trial for all our websites, so you can play around our editors and create the perfect website for your business.


Leave a reply




 

FREE EBOOK

Learn how to engage your audience and
build brand recognition across social
channels. Learn more...

Free eBook

Search Resolve

Search

READY TO GET STARTED?

Pick your package. Pick your design.
No credit card required.

Start 14-day Free Trial
Compare packages