Næsten alle blogging platforme, herunder Blogger, har funktionen "citattekst". Dette er nyttigt, når du vil fremhæve afsnit fra andre tekster, eller hvor du skal fremhæve oplysninger fra din egen artikel. Citeret tekst kan tilpasses til at se anderledes ud end hoveddelen af ​​din artikel, og disse forskelle gør det skiller sig ud.

I denne artikel vil jeg beskrive, hvordan du bruger funktionen "Citattekst" i Blogger-blogs, samt hvordan du tilpasser dets udseende.

Sådan citeres tekst

Valg af tekst til citering er ret let. I Blogger kan du f.eks. "Citere tekst" ved at vælge det og trykke på "citattekst" -knappen.

Du kan også vælge tekst til at citere ved at tilføje "

"Tag rundt i teksten.

Standardlook er en simpel indrykning, og det hjælper ikke med at differentiere det fra resten af ​​artiklen. Så det er nyttigt at ændre udseendet af den standard citatte tekst.

Redigere udseendet af den citatte tekst

Redigering af udseendet af citeret tekst kræver redigering af den grundlæggende HTML-design af din blog. Jeg dækkede, hvordan du redigerer dette i min tidligere artikel om Blogger Favicons.

Først skal du åbne dit Blogger-dashboard og vælge " Design ".

Dernæst skal du vælge " Rediger HTML" i hoved Blogger-vinduet.

Dette åbner HTML-skabelon editoren. Her kan du tjekke " Expand Widget Templates" for at sikre, at al HTML-koden til din blog er synlig.

Rul derefter ned og kig efter det afsnit, der indeholder ordet " blockquote ". Alle relevante valgmuligheder for den citerede tekst går mellem "{" og "}".

Tilpasning af udseendet af den citerede tekst

De muligheder jeg bruger til min citatte tekst på min personlige blog TechComet er som følger:

 blockquote {margin: 1em 20px; baggrund: #dfdfdf; polstring: 8px 8px 8px 8px; skrifttypestil: kursiv }

Dette giver følgende effekt, når jeg vælger tekst til at citere:

Teksten er let indrykket, den er kursiv og der er en blød grå baggrund. Disse ændringer gør virkelig den citatte tekst mere slående, og det er nemt at differentiere det fra hovedelementet i artiklen.

Der er en række forskellige muligheder, du kan tilføje til din citatte tekst, og jeg vil diskutere dem nedenfor.

Margin

Først vil du gerne indrykke din tekst, så den ikke er i samme linje som resten af ​​din artikel. Du kan gøre dette ved at justere antallet af pixels, som marginen er fra resten af ​​teksten. Jeg har sat min til 20px. Juster denne værdi, som du finder passende.

 margen: 1em 20px

Baggrundsfarve

Derefter kan du ændre baggrundsfarven ved at justere taggen " baggrund" . Jeg har valgt en lysegrå farve. Farverne i HTML-koden er repræsenteret af seks "hexdigits". Du kan få en liste over farver og deres tilsvarende hexdigit herfra.

 baggrund: #dfdfdf

polstring

Mængden af ​​"polstring" du bruger bestemmer den afstand, som den citerede tekst er fra kanten af ​​boksen, der er oprettet af baggrundsfarven. Jo mindre antallet af pixels, desto tættere bliver teksten til kanten af ​​kassen.

Den første figur er afstanden (i pixels) fra toppen af ​​citattekstboksen til begyndelsen af ​​teksten, den anden figur er det højre indtryk, den tredje figur er bundindrykket, og den fjerde figur er det venstre indtryk (I kort, de 4 figurer starter fra toppen og går i retning med uret).

 polstring: 8px 8px 8px 8px

Skrifttype

Du kan også fed eller kursivisere den citatte tekst for virkelig at få det til at se anderledes ud end resten af ​​din artikel.

 skrifttypestil: kursiv skrifttype: fed

Grænser

Jeg har ikke valgt at tilføje en ramme til min citatte tekst, men hvis du ønsker det, kan du gøre det ved at bruge " border" -taggen. Du skal vælge tykkelse, stil og farve på din kant.

 border: 2px solid #dfdfdf border: 2px stiplede #dfdfdf

Konklusion

I de fleste moderne blogs er der ofte sektioner, der er citeret fra andre hjemmesider og blogs. For at få din blog til at skille sig ud og tilføje et "professionelt" touch til det, vil jeg anbefale at bruge lidt tid og tilpasse udseendet af din citatte tekst.

Lad os vide, hvordan tekst er citeret i dine artikler!