Så här kontrollerar och genererar metataggar för din webbplats

I detta snabba tips ska jag presentera dig för ett enkelt men ändå väldigt användbart verktyg som heter Hey Meta. Om du är intresserad av att se vad din webbplatss delprofil ser ut, och du vill se till att metataggarna du använder är korrekta, är Hey Meta precis vad du behöver. Låt oss dyka in!

Få dina metataggar rätt

 

Kontrollera dina metataggar

Kontrollera effektiviteten av din webbplatss nuvarande metakodsinställning genom att ange webbadressen i inmatningsfältet. Du kommer att visas en förhandsgranskning av sociala kort (vad som sannolikt kommer att visas på sociala nätverk, dela appar etc.) och titeln, beskrivningen, den utvalda bilden av den aktuella webbadressen.

Ange URL här

Om din webbsida inte har några metakoder för dessa objekt alls kommer ingenting att visas.

Skapa korrekta metataggar

Om din sida verkar vara saknad information eller visar felaktiga (eller suboptima) metadata kan du använda Hej Meta för att skapa korrekta taggar för dig. Ange informationen du vill visa i fälten som visas:

Skriv in titeln här

Detsamma kan göras för beskrivning av webbplatsen, webbadressen och den utvalda bilden. De genererade taggarna kommer att visas i förhandsgranskningarna och markeringen kommer att se ut så här:

 Testwebbplats                 

Här ser du de inbyggda HTML-metataggarna som </code>, Twitter-taggar och Open Graph-taggar som <code><meta property="og:title"></code> vilket möjliggör korrekt social delning. Dessa taggar kan sedan placeras i <code><head></code> av ditt HTML-dokument.</p><h2>Slutsats</h2><p>Se till att dina metataggar visar dina webbplatsuppgifter korrekt!</p><h3>Vidare läsning</h3> <div class="rek-block"> <center> <ins class="adsbygoogle" style="display:inline-block;width:580px;height:400px" data-ad-client="ca-pub-3810161443300697" data-ad-slot="9434875811"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </center> </div> <div class="h-alltags"> <a href="articles/webdesign">Webbdesign</a> </div> </div> </div> </div> </div> <div class="next_posts clearfix"> <div class="n_post"> <div class="next_posts-h1 left_nh1"><a href="/articles/photography/how-to-check-for-correct-skin-tones-in-video-with-adobe-premiere-pro.html">Så här söker du efter korrekta hudtoner i video med Adobe Premiere Pro</a></div> <div class="next_posts-img" style="background-image: url('//accentsconagua.com/img/images_2/how-to-check-for-correct-skin-tones-in-video-with-adobe-premiere-pro_2.jpg');"></div> </div> <div class="n_post"> <div class="next_posts-h1 right_nh1"><a href="/articles/business/how-to-charge-premium-prices-and-write-winning-proposals.html">Hur man laddar premiepriser och skriv vinnande förslag</a></div> <div class="next_posts-img" style="background-image: url('//accentsconagua.com/img/images_10/how-to-charge-premium-prices-and-write-winning-proposals.png');"></div> </div> </div> <footer> <div class="container"> <div class="footer-langs"> <ul class="site-langs-list"> <li><a href="https://www.accentsconagua.com"><i class="flag flag-DE"></i>Deutsch</a></li> <li><a href="https://fr.accentsconagua.com"><i class="flag flag-FR"></i>Français</a></li> <li><a href="https://nl.accentsconagua.com"><i class="flag flag-NL"></i>Nederlands</a></li> <li><a href="https://no.accentsconagua.com"><i class="flag flag-NO"></i>Norsk</a></li> <li><a href="https://sv.accentsconagua.com"><i class="flag flag-SE"></i>Svenska</a></li> <li><a href="https://it.accentsconagua.com"><i class="flag flag-IT"></i>Italiano</a></li> <li><a href="https://es.accentsconagua.com"><i class="flag flag-ES"></i>Español</a></li> <li><a href="https://ro.accentsconagua.com"><i class="flag flag-RO"></i>Românesc</a></li> </ul> </div> <div class="h-block"><a href="/">ro.accentsconagua.com</a><div class="h-block-a"></div></div> <div class="footer-text"> Informații interesante și sfaturi utile privind programarea. Dezvoltarea de site-uri, web design si dezvoltare web. Tutoriale Photoshop. Crearea de jocuri pe calculator și aplicații mobile. Deveniți un programator profesionist de la zero. </div> </div> </footer> <div class="search"> <img class="searchico" src="//accentsconagua.com/img/search.svg" alt=""> </div> <div class="modal"> <div class="modal-content"> <span class="close-button">×</span> <input class="searchmain" type="text" id="search-input" placeholder="Căutare..."> <ul class="searchli" id="results-container"></ul> </div> </div> <link rel="stylesheet" href="css/flags.css"> <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css" /> <script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script> <script> window.addEventListener("load", function(){ window.cookieconsent.initialise({ "palette": { "popup": { "background": "#edeff5", "text": "#838391" }, "button": { "background": "#4b81e8" } }, "theme": "classic", "position": "bottom-right" })}); </script> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <script src="js/scripts.min.js"></script> <script src="js/common.js"></script> <link rel="stylesheet" href="css/fontawesome-all.min.css"> <script> var modal = document.querySelector(".modal"); var trigger = document.querySelector(".search"); var closeButton = document.querySelector(".close-button"); function toggleModal() { modal.classList.toggle("show-modal"); } function windowOnClick(event) { if (event.target === modal) { toggleModal(); } } trigger.addEventListener("click", toggleModal); closeButton.addEventListener("click", toggleModal); window.addEventListener("click", windowOnClick); </script> <script src="https://unpkg.com/simple-jekyll-search@1.5.0/dest/simple-jekyll-search.min.js"></script> <script> SimpleJekyllSearch({ searchInput: document.getElementById('search-input'), resultsContainer: document.getElementById('results-container'), json: '/search.json', searchResultTemplate: '<li><a href="{url}">{title}</a></li>' }) </script> <script src="jquery.unveil2.min.js"></script> <script> $('img').unveil(); </script> </body> </html>