I dette raske tipset skal jeg introdusere deg til et enkelt, men veldig nyttig verktøy som heter Hey Meta. Hvis du er interessert i å se hvordan nettsiden din delingsprofil ser ut, og du vil forsikre deg om at metakoder du bruker er riktige, er Hey Meta akkurat det du trenger. La oss dykke inn!
Få Meta Tags Right
Sjekk dine metatagger
Kontroller effektiviteten av nettstedets nåværende metakodeoppsett ved å skrive inn nettadressen i inntastingsfeltet. Du vil bli vist en forhåndsvisning av sosiale kort (hva som sannsynligvis vil bli vist på sosiale nettverk, deling av apper etc.) og tittelen, beskrivelsen, kjennetegnet bilde av den aktuelle nettadressen.
Skriv inn URL her
Hvis websiden din ikke har noen metakoder for disse elementene i det hele tatt, vil ingenting bli vist.
Generer riktige metatagger
Hvis siden din ser ut til å mangle detaljer, eller viser feil (eller suboptimal) metadata, kan du bruke Hey Meta til å generere riktige koder for deg. Skriv inn informasjonen du vil vise i feltene som vises:
Skriv inn tittelen her
Det samme kan gjøres for nettsidebeskrivelsen, nettadressen og kjennetegnet bilde. De genererte kodene vises i forhåndsvisningene, og merkingen vil se slik ut:
Test nettside
Her ser du de opprinnelige HTML-metatakene som </code>, Twitter-koder, og Open Graph-koder som <code><meta property="og:title"></code> som tillater riktig sosial deling. Disse kodene kan da plasseres i <code><head></code> av HTML-dokumentet ditt.</p><h2>Konklusjon</h2><p>Sørg for at metatagsene dine viser dine nettsider nøyaktig!</p><h3>Videre lesning</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">Webdesign</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">Slik sjekker du etter riktige 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">Hvordan lade premiepriser og skrive vinnende forslag</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="/">no.accentsconagua.com</a><div class="h-block-a"></div></div>
<div class="footer-text">
Interessant informasjon og nyttige tips om programmering. Nettstedutvikling, webdesign og webutvikling. Photoshop opplæringsprogrammer. Opprettelse av dataspill og mobile applikasjoner. Bli en profesjonell programmerer fra grunnen av.
</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="Søke...">
<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>
Share
Skriv inn URL her
Skriv inn tittelen her
Accentsconagua