Hjemmeside » WordPress » Sådan bruges AMP med WordPress

    Sådan bruges AMP med WordPress

    AMP er en fælles indsats, som lover a bedre sidebelastningsydelse for websteder i mobilmiljøet. Men som du kan finde fra vores tidligere tutorial, bliver du nødt til at ofre fancy ting fra dit website og nøje følge reglerne, overholde retningslinjerne og få sider valideret. Det lyder som meget at gøre, gør det ikke?

    Heldigvis, hvis du har opbygget din hjemmeside med WordPress, kan du anvende AMP på din hjemmeside i et øjeblik med et plugin, der hedder AMP-WP. Den leveres med flere funktioner end hvad der møder øjet. Så lad os se, hvordan det virker.

    Aktivering

    Til at begynde med, log ind på dit websted, gå til Plugins> Tilføj nyt skærm. Søge efter “AMP; installer og aktiver den fra Automattic.

    Når du er aktiveret, kan du se det AMP-konverterede indlæg ved at tilføje / Amp / spor i slutningen af ​​postadressen (f.eks. http://wp.com/post/amp/), eller med ?amp = 1 (f.eks. http://wp.com/post/?amp=1), hvis du ikke bruger funktionen Pretty Permalinks på din hjemmeside.

    Og som du kan se ovenfor har posten fået grundlæggende stylings, som du kan tilpasse yderligere.

    At notere

    Der er et par ting, du bør vide om tilstanden af ​​pluginet i øjeblikket:

    • Arkiv - Kategori, tag og Brugerdefineret taxonomi - understøttes i øjeblikket ikke. De vil ikke blive konverteret til AMP-kompatibelt format. Dog kan Custom Post Types initieres i AMP via et filter.
    • Den tilføjer ikke i en ny indstillingsskærm i betjeningspanelet. Tilpasning sker på kodeniveau med handlinger, filtre, klasse.
    • Proppen omfatter ikke for øjeblikket alle AMP-brugerdefinerede elementer som f.eks amp-analyser og amp-annonce ud af boksen. Hvis du har brug for dette element, skal du inkludere det ved at hænge ind i Handlinger eller Filtre i plugin'et.

    Tilpasning

    Pluginet indeholder mange handlinger og filtre, der giver fleksibilitet i forhold til at tilpasse stilarterne, sideindholdet og endda HTML-markeringen af ​​AMP-siden som helhed.

    styles

    Jeg er sikker på, at dette er en ting, du vil ændre umiddelbart efter aktivering af pluginet, som f.eks. Ændring af overskriftsbakgrundsfarve, skrifttypefamilien og skrifttypestørrelsen for bedre at matche dit website brand og personlighed.

    For at gøre det kan vi ansætte amp_post_template_css Handling i functions.php fil af vores tema.

    funktion theme_amp_custom_styles () ?> nav.amp-wp-title-bar baggrundsfarve: orange;   
    Hvis vi kigger igennem Chrome DevTools, tilføjes disse stilarter i