Hvordan skrive CSS for et miniatyrbilde i WordPress

Hvordan skrive CSS for et miniatyrbilde i WordPress


En av de mange funksjonene WordPress har er dens evne til å generere automatiske miniatyrbilder for bilder på nettstedet ditt. Sette samtalen the_post_thumbnail () i din WordPress mal plasserer automatisk en mindre versjon av din omtalt bildet i side eller post. Du kan angi standardstørrelsen på miniatyrbildene i papirinnstillingene når du er logget inn på din WordPress dashbordet, og du kan også angi en stil via CSS hvis du ønsker å legge til ytterligere tilpasning til miniatyrbilde.

Bruksanvisning

1 Logg deg inn på din WordPress nettstedet og klikk på "Utseende" og deretter "Editor".

2 Velg "stylesheet" fra listen til høyre.

3 Legg CSS for miniatyr hjelp av online editor. For eksempel, hvis du ønsker å justere miniatyrbildet til venstre og vise en solid svart farge for det, kan du legge inn denne koden:

img.alignleft {

float: left;

border: 1px solid # 000;

}

4 Klikk på "Update File".

5 Velg malen der du har "the_post_thumbnail" kode. Hvis det ligger innenfor en WordPress-side, velger du "Side" mal fra listen over maler på høyre side.

6 Redigere koden for å bruke den stilen du har angitt for miniatyr din. Følgende kode viser miniatyr bruker nettstedets standard miniatyrstørrelse, med stilen du definerte i stil malen:

<? Php the_post_thumbnail ( 'thumbnail', array ( 'klasse' => 'alignleft')); ?>

7 Oppdater malfil for å bruke endringene.

Hint

  • Bortsett fra å definere dine egne velgere, kan du også benytte CSS velgere img.wp-post-image, img.attachment-miniatyr, img.attachment-medium, img.attachment store og img.attachment full til å definere stiler for thumbnail.