Custom WordPress Website Design

How to Get Good Link Previews

When someone shares something from your website onto Facebook, how does it look? Is there a nice title and photo or could it use some improvement? What about the Google search results that show up when you search for your business website? The text and images displayed are called a link preview and improving them can help to create a more professional look for your brand on the internet. Getting these attractive link previews is easy with a bit of know-how.

Link previews use what is known as Open Graph protocol, an internet rule standardized by Facebook, and can be seen in the code of your website as “og : SOMETHING”. This information can then be used by a variety of sites and programs to understand the title, description, author name, image, image size, link, and more to share and display it. As a group, this information is often referred to as metadata. This information can be the same for all uses or customized by channel, for instance with a shorter description to comply with character count restrictions.

This information is always placed in the <head> tag of a website. The specific information varies by each page so that the title, description, image, etc are appropriate for the content on that specific page. In general, this is how the link preview code will look in your website.

Website Meta Code

The meta information specified in this code is also used by Google and other search engines to determine how organic search results appear. The og information in the code above is translated by Google and Facebook into the previews below.

Google and Facebook preview screenshots

The way you set your meta information will depend on the type of website you have. WordPress makes it easy to set meta information for all your posts and pages and there are a variety of plugins that can do all the heavy code lifting for you. Yoast is the most popular SEO plugin for WordPress and has a really nice basic meta information creator built in.

For people looking to add additional information or fields into their meta description, there are a variety of free tools available. These tools can enable additional features like image carousels or enhanced descriptions based on type of webpage content. It’s important to look for an Open Graph or og metadata creator to ensure you have the proper format to have your information show up correctly. These generators will then create simple HTML code that can be pasted directly into the header section of your webpage.

Adding meta data and creating attractive, shareable links for your website is a great way to enhance your brand recognition and increase the awareness of your company. If your WordPress site is set up correctly, these link previews can be generated automatically when you create a new page. Need help getting set up? Contact us to discuss your next website redesign or for affordable hourly WordPress assistance.

Need Help?

Feel free to contact us if you have any questions, concerns or issues.

Custom Web Design

See How Affordable It Can Be →

We are ready to capture great ideas and transform them into amazing solutions that solve current website issues.