Canonical links
By adding a canonical link element to the HTML head section of a webpage, website owners can inform search engines about the preferred or canonical URL that should be considered the original and authoritative version. Search engines then consolidate the ranking signals for all duplicate URLs and attribute them to the canonical URL, avoiding any negative consequences related to duplicate content.
Requirements
Enter your preferred URL in the form field.
Custom HTML snippets
We offer an integration Custom HTML Snippets to empower you with the capability to inject your code directly into your webpage within Vev's platform. This integration proves especially valuable when you find that certain elements are missing in Vev, like the ability to add tracking codes to the head section of your webpage, especially if your preferred tracking platform is not listed.
Requirements
For optimal webpage performance, it is essential to carefully choose the injection point of your custom HTML snippet. You have four placement options:
Start of Head: Placing your custom HTML snippet at the beginning of the
<head>the section ensures that it loads early in the page rendering process. This is particularly beneficial for crucial scripts or stylesheets that need to be applied before other content is rendered.End of Head: Injecting your custom HTML snippet at the end of the
<head>section allows it to load after essential resources have been loaded. This can be useful for supplementary scripts or stylesheets that don't require immediate loading.Start of Body: Adding your custom HTML snippet at the beginning of the
<body>section ensures that it loads before other content in the body, potentially improving the overall perceived loading speed of your webpage.End of Body: Placing your custom HTML snippet at the end of the
<body>section allows it to load after all other content in the body has been rendered. This can be helpful for non-essential scripts or content that won't impact the initial page load.
Considering the significance of webpage performance, it is recommended to choose the most appropriate injection point based on its importance and relevance to the overall webpage functionality.
Custom scripts
Custom Scripts can be used to inject external JavaScript files into the <head> and <body> sections of an HTML document. The actual data to be injected into the template will be provided at runtime, resulting in a complete HTML document with the necessary scripts included.
The async and defer attributes can be used to control how the JavaScript files are loaded, which can affect the performance of the webpage.
Requirements
Paste the script URL into the form field provided. Double-check for any typos or errors in the URL to ensure smooth execution. The URL should point directly to the script file hosted on a server or a Content Delivery Network (CDN).
Async: When you toggle the
asyncattribute on, the browser will load the script asynchronously, which means that it can start loading other resources while the file is still being downloaded. This can improve the performance of the webpage by preventing the browser from being blocked while the script is loading.Defer: When you toggle the
deferattribute on, the browser will load the script deferred, which means that it will not be executed until all other resources have been loaded. This can be useful for scripts that need to access the DOM, as it ensures that the DOM is fully loaded before the script is executed.
In general, the async attribute is a good choice for scripts that do not need to access the DOM, while the defer attribute is a good choice for scripts that do need to access the DOM.
Meta tags
Meta tags are essential elements that are placed within the 'head' element of a webpage. They play a crucial role in specifying various aspects such as the character set, page description, keywords, document author, and viewport settings. Acting as content descriptors, meta tags aid search engines in understanding the content and purpose of the web page.
Requirements
Webpage author: This attribute allows you to specify the name or identity of the person or entity responsible for creating the webpage's content. It is useful for providing attribution and is often used for informational purposes.
Add keywords for SEO: In this field, you can input relevant keywords or key phrases that are associated with the webpage's content. These keywords help search engines understand the content and improve the webpage's search engine optimization (SEO), making it more likely to appear in relevant search results.
Description: The description attribute allows you to provide a concise and informative summary of the webpage's content. This description is often displayed in search engine results and can greatly influence a user's decision to click on the webpage link. It should be engaging and accurately represent the content of the page.
If you have an array of custom Meta tag configurations, and you want to dynamically generate Meta tags for a webpage based on these configurations, then click the “Add item +” button. The generated Meta tags will include the specified "name," "property," and "content" attributes as defined in the Custom Meta tags array.
Open Graph meta tags
Open Graph meta tags are code snippets that govern the appearance of URLs when shared on social media platforms. Including social media metadata on your website is considered a best practice, as it determines how various elements such as the title, URL, image, description, and site name of your webpage should be displayed when shared.
These meta tags are based on Meta’s (Facebook) Open Graph protocol and are utilized by several other social media sites, including LinkedIn and Twitter. You can locate them within the head section of a webpage. Any tags with the prefix 'og:' before a property name signify Open Graph tags
Requirements
To transform your web pages into graph objects and enhance their presentation on various platforms, it is essential to incorporate vital metadata. The following four properties are mandatory for each page:
Title (
og:title) - This represents the title of your webpage and will be displayed prominently within the graph when shared or referenced. Per default, we use@vev.page.titleto reference the title of the page automatically.OG Type (
og:type) - Your webpage's OG type, such as "video.movie," allows platforms to categorize and handle the content appropriately. Depending on the specified type, additional properties may also be required to provide more context. The default value here iswebsite.URL (
og:url) - Providing the canonical URL of your webpage is crucial as it serves as its permanent identifier within the graph. This ensures that the correct page is associated with the shared content.@vev.urldefines the URL of your webpage per default.Image (
og:image) - An image URL that effectively represents your webpage within the graph. This visual representation is essential for attracting users' attention and improving engagement when shared on social media or other platforms.@vev.page.coverfetches the image you have defined for your webpage in Project Settings.
In addition to the core settings, you have the flexibility to include additional parameters that further enrich your website’s representation:
Description: Provide a concise one to two-sentence description of your website. This brief snippet gives users a glimpse of what your content is about and entices them to explore further. Go to Page Settings and enter your description of your content. With
@vev.page.descper default, it will be retrieved automatically.Locale: Specify the locale for which these tags are marked up using the format
language_TERRITORY, e.g.en_US.You can customize it to cater to specific language and regional preferences.Alternate Locales: Consider including an array of other available locales on this page. By doing so, you accommodate users from diverse linguistic backgrounds and create a more inclusive experience.
Site Name: If your webpage is part of a larger website or brand, it's valuable to display the site's name. This helps users easily identify the source of the content and fosters brand recognition. The default value
@vev.project.titlefetches the name of your project automatically.
By adhering to these requirements and including accurate metadata, your web pages will be optimized to appear more appealing and informative in various contexts. This, in turn, can significantly boost the visibility and reach of your content across different platforms.
Open Graph: Article
In addition to Open Graph Meta Tags, you can integrate this as an add-on to optimize SEO for articles and blog posts. The article tags are used by social media platforms to display the webpage when it is shared on social media.
Requirements
You can add the following properties:
article:published_time- datetime - When the article was first published.article:modified_time- datetime - When the article was last changed.article:expiration_time- datetime - When the article is out of date after.article:author- profile array - Author of the article.article:section- string - A high-level section name, e.g. technologyarticle:tag- string array - Tag words associated with this article.
Social Media meta tags
This Social Media Meta Tags integration empowers you to define a featured image, page title, description, and URL for optimal representation when sharing your site on social media platforms Facebook and Twitter. They rely on these parameters extracted directly from your website. By utilizing this integration, you gain complete control over the content they extract from your post.
Requirements
Facebook-related tags:
To begin, enter your Facebook App ID. If you're unsure how to find it, check out this helpful blog post. Next, you have the option to add your Facebook Admin ID. This blog post will guide you through the process of finding it. Additionally, you can include your Facebook Page ID to connect your web content to your Facebook page. Learn more about this process here.
Twitter Card-related tags:
For Twitter, you can choose from different card types to determine how your content is presented. Options include summary, summary_large_image, app, and player.
Enter your Twitter site, such as "@Whitehouse," and your Twitter username, e.g., "@realDonaldTrump," to effectively associate your content with your Twitter presence.