Webdesigners guide til Tumblr

Forfatter: Louise Ward
Oprettelsesdato: 11 Februar 2021
Opdateringsdato: 22 Juni 2024
Anonim
Create a Tumblr Blog - Complete Tutorial
Video.: Create a Tumblr Blog - Complete Tutorial

Indhold

Denne artikel optrådte først i nummer 213 af .net magazine - verdens bedst sælgende magasin til webdesignere og udviklere.

Hvor mange gange har du sagt, "Dette er året, hvor jeg endelig starter en blog"? Som mange begynder du den langvarige og vanskelige proces med at designe et websted til den sværeste klient - dig selv - kun for at se det bevæge sig bagefter hver gang rigtige betalende kunder kommer i vejen.

Når du endelig har sømmet designet, begynder processen med at opbygge og udvikle din blog. Efter uger (eller måneder) er det endelig tid til at trykke på startknappen. Et eller andet sted mellem dit fjerde og femte indsigtsfulde og strålende indlæg rammer det dig ... at holde denne blog opdateret vil tage en enorm mængde arbejde.

Personligt har jeg fundet mig selv fanget i den nøjagtige cyklus mere end en gang gennem årene. I begyndelsen af ​​2009 kom jeg til erkendelsen af, at jeg havde brug for at overveje nøjagtigt, hvad jeg forsøgte at opnå med en personlig blog. Ideen om at skrive lange blogindlæg et par gange om ugen lyder fantastisk, men for mig var det simpelthen ikke realistisk. Jeg tweetede allerede, men det, jeg virkelig havde brug for, var evnen til at dele lidt mere med korte, direkte og aktuelle indlæg. Min søgen efter enkelhed førte mig direkte til Tumblr.


Kom godt i gang

Den 6. april 2009 tilmeldte jeg mig en konto og begyndte at sende. Ved hjælp af Tumblr's Theme Garden valgte jeg et grundlæggende tema, som jeg vidste, jeg kunne leve med, mens jeg gav Tumblr en prøvekørsel. Enkelheden ved platformen betød også, at jeg ikke behøvede at bekymre mig om at installere blogging-software på min server. Jeg lægger alt for at kurere indhold om design, kultur, teknologi og forretning sammen med mine personlige tanker og meninger.

Næsten to år senere har jeg formået at holde fast i blogging på Tumblr med næsten 600 indlæg på mit websted på www.jonathanmoore.com: et gennemsnit på 0,85 indlæg om dagen. I dag er jeg klar over, at enkelheden er, hvad der har hjulpet mig med at forblive konsistent med udstationering, men netværket af mennesker på Tumblr er det, der holder mig begejstret for platformen. Tumblr forenkler den typiske blog, hvilket gør blogging smukt let. Millioner af mennesker over hele kloden deler ting, de gør, elsker, finder og skaber.


Kernen i Tumblr er otte indlægstyper - tekst, foto, citat, link, chat, lyd, video og besvarede spørgsmål - som du kan offentliggøre på instrumentbrættet. Dette gør det let at dele alt, hvad du finder eller opretter. Hvis du sender en video, er selve videoen det primære emne, og derefter kan du tilføje en valgfri billedtekst for at give kontekst, indsigt eller detaljer om den. Det samme gælder for andre indlægstyper, med undtagelse af tekstindlæg, som gør det muligt for dig at oprette mere typiske blogindlæg med en kombination af tekst, billeder og video i det enkelte indlæg.

Ikke kun forenkler Tumblr posttyperne, det giver dig også en bred vifte af måder at sende til din blog. Personligt har jeg en tendens til at bruge Dashboard det meste af tiden, men der er en række andre måder at sende indhold til din blog.

  • Bookmarklet, som lader dig sende direkte fra din browser, mens du surfer på nettet
  • Mobilapplikationer til iPhone, BlackBerry og Android
  • Sofistikeret e-mail-udgivelse for at sende tekst, fotos, MP3'er eller videoer direkte fra din mobiltelefon eller via e-mail
  • Ring til lydindlæg med et gratis nummer
  • Mange andre tredjepartsapplikationer (www.tumblr.com/docs/en/apps)

For flere detaljer om de forskellige måder at sende til Tumblr, se www.tumblr.com/goodies.


Samfundet

Sikker på, du kan bruge Tumblr simpelthen som en måde at opdatere din blog på, men du går glip af det rige og fascinerende Tumblr-samfund. Den virkelige sjov begynder, når du følger en håndfuld interessante, inspirerende og ligesindede mennesker. Og når din blog har opbygget en anstændig følge, er det fantastisk at se, hvor hurtigt et indlæg kan sprede sig over platformen med likes og reblogs.

Uden for at følge kendte mennesker på Tumblr er den indbyggede bibliotek en fantastisk måde at opdage nye mennesker på platformen. Kataloget er opdelt i næsten 50 kategorier, der dækker en bred vifte af emner, herunder designere, udviklere, iværksættere, startups, arkitektur, non-profit og rejser. Brug en time eller to på at gennemse blogs, der anbefales af samfundet, og snart har du en fremragende gruppe af websteder, der skal følges som udgangspunkt.

Tumblr har bygget på en række måder til at belønne folk, der sender originalt, inspirerende, kreativt og interessant indhold til deres blogs. Det mest synlige ville være likes og reblogs. Øverst på hver blogs permalink-side og på instrumentbrættet finder du et hjerteikon til at 'like' indlægget. Hvis du støder på et indlæg, som du synes er værd at dele, eller hvis du vil føje dine egne tanker til det, kan du reblogge indlægget til din egen blog. Reblogging er den måde, hvorpå en idé eller et indlæg hurtigt spreder sig over et netværk af tusinder af blogs.

Bliver mobil

Hurtigere end vi er klar over, er folk begyndt at droppe deres bærbare computere til fordel for mobile enheder, så Tumblr har oprettet mobilapplikationer og mobiloptimerede bloglayouts. Applikationer til iPhone-, BlackBerry- og Android-platforme giver dig mulighed for at gennemse dit Dashboard og offentliggøre alle indlægstyper direkte fra din telefon. IPhone- og Android-applikationerne giver dig adgang til Tumblrs avancerede bogføringsmuligheder - gem som kladde, tilføj til kø, offentliggør på og tilpasset webadresser.

E-mail dine indlæg direkte til din blog med Tumblrs sofistikerede e-mail-udgivelse. Gå til siden Goodies (tumblr.com/goodies) for at finde ud af dit websteds unikke e-mail-adresse.

Når du trykker på send, registrerer Tumblr automatisk typen af ​​indlæg, du prøver at oprette, og offentliggør det på dit websted. Hvis du vil have lidt mere kontrol over formateringen, har Tumblr support til Markdown-syntaks (daringfireball.net/projects/markdown/syntax).

Alle dine blogs har et optimeret og smukt mobillayout til iPhone, BlackBerry, Android og mere. Hvis det tema, du bruger, fungerer godt i mobilbrowsere, kan du altid deaktivere det optimerede layout i menuen Tilpas. Tumblr giver dig også muligheden for at overskrive standardmobillayoutet med din egen brugerdefinerede: se tumblr.com/docs/en/custom_themes#iphone-themes.

Temaer

Med Tumblrs dedikation til at holde alle posttyper så enkle som muligt, er det utroligt nemt at ændre dit websteds design. Du kan vælge blandt de hundredvis af gratis og premium-temaer, der er indbygget i Tumblr; alternativt giver Tumblr dig fuld kontrol over at skabe noget originalt.

I øjeblikket er der næsten 900 temaer af høj kvalitet i Tumblrs indbyggede Theme Garden (tumblr.com/themes). Når du gennemsøger de fremhævede, premium, nylige og populære temaer, kan du få vist hver enkelt for at få en fornemmelse for, hvordan det kan se ud på dit websted. Når du har fundet en der fungerer for dig, kan du med et enkelt klik installere temaet på et af dine Tumblr-websteder.

De fleste af disse temaer er helt gratis at bruge og tilpasse, men en håndfuld kommer til en præmie, der koster $ 9, $ 19 eller $ 49 (tumblr.com/themes/premium). Du finder ud af, at de fleste af premium-temaerne har design i topkvalitet, hver Tumblr-funktion er dækket, snesevis af tilpasningsmuligheder og sprogoversættelsessupport til engelsk, fransk, tysk, italiensk og japansk. Plus de fleste af de premium tema designere tilbyder utrolig support til hvert af deres temaer.

Uden for Tumblrs officielle Theme Garden tilbyder virksomheder, der traditionelt har fokuseret på WordPress-temaer, nu Tumblr-versioner, herunder Theme Foundry (thethemefoundry.com) og Obox (obox-design.com). I mange tilfælde tilbyder de ekstra godbidder med dit køb, såsom PSD-filer, der kan downloades, og adgang til andre temaer. Selvom temaer uden for webstedet ikke kan tilbyde installationer med et enkelt klik, er det så simpelt at tilføje temaet til dit websted som at indsætte temaet HTML i menuen Tumblr Tilpas.

Tilpasning af dit websted

Tumblr har en utrolig nyttig indbygget tilpasningsmenu, der giver dig mulighed for at personalisere, udvide og kontrollere en række funktioner til hvert af dine websteder. Lad os se på et antal af mulighederne i de syv Tilpas-menuer:

  • Info Indstil dit websteds titel, tilføj en HTML-beskrivelse, upload et portræt eller ikon, og indstil din Tumblr-URL inklusive muligheden for at tilføje dit eget brugerdefinerede domænenavn.
  • Tema Se, installer og køb i nogle tilfælde et af premium eller featured Tumblr temaer. Derudover kan du klikke på knappen Brug tilpasset HTML til at ændre dit eksisterende temas HTML eller indsætte i dit eget tilpassede HTML-tema.
  • Udseende Hvis dit tema understøtter udseendemuligheder, finder du et antal farvevælgere, knapper til upload af billeder, muligheder for at aktivere og tekstfelter for at tilpasse udseendet og følelsen af ​​dit tema. Mange af de premium Tumblr-temaer tilbyder flere dusin muligheder, der giver dig mulighed for at ændre temaets farver, uploade headerbilleder, ændre webstedslayoutet og integrere tredjepartsindstillinger som Google Analytics, Disqus-kommentarer og Flickr-billedfeeds ved at indsætte i din ID'er.
  • sider Føj yderligere statiske sider til dit websted, der er perfekte til biografier, kontaktoplysninger og webstedsoplysninger. Derudover kan du omdirigere sider, der fører dig til eksterne links eller ofte til pseudokategorier ved at linke til en tag-URL på dit websted.
  • Tjenester Forbind dit Tumblr-sted med Facebook og tilføj dine indlæg problemfrit til dit Facebook-nyhedsfeed. Giv Tumblr tilladelse til automatisk at sende dine indlæg til Twitter og bruge Feedburner til dit websteds RSS-feed.Tumblr giver dig også mulighed for automatisk at importere RSS-feeds, opdateringer på Twitter, blogindlæg uden for Tumblr, YouTube og Vimeo-uploads og andre som indlæg til dit Tumblr-websted.
  • Fællesskab Giv folk mulighed for at svare på dine indlæg, stille dig spørgsmål og indsende enhver posttype, der føjes til din indsendelse kø til godkendelse.
  • Fremskreden Indstil dit tema og Dashboard-sprog til engelsk, fransk, tysk, italiensk eller japansk, tilføj tilpasset CSS for at overskrive et af temaets CSS-egenskaber, bestem antallet af indlæg, der vises pr. Side og mange andre muligheder.

Brugerdefinerede temaer

Det samme fokus på enkelhed og struktur, som Tumblr giver til udstationering og deling, fortsætter med værktøjet til at oprette dit eget brugerdefinerede tema. Så længe du er fortrolig med HTML og CSS, skal du være i stand til at give dit design liv på rekordtid. Tumblrs temasystem er afhængig af krøllede parentesvariabler og blokke, der gør det muligt for dig at slippe næsten alle typer post- og webstedsdata med nul back-end-udvikling.

Når du opretter et nyt Tumblr-tema, er det altid nemmest at opbygge dit design med ren og ligetil HTML og CSS, der dækker de otte centrale posttyper - tekst, foto, citat, link, chat, lyd, video og svar - og alle de andre forskellige Tumblr-elementer såsom post tags, datoer, noter og paginering. Når du har en komplet statisk HTML-opbygning af dit websted, kan du begynde den sjove del af at slippe temavariablerne. Variabler (i fed skrift) bruges til at indsætte dynamiske data i dit tema.

html lang = "da"> head> title> {Title} / title> meta name = "description" content = "{MetaDescription}" /> link rel = "genvejsikon" href = "{Favicon}" /> link rel = "apple-touch-ikon" href = "{PortraitURL-128}" /> link rel = "alternativ" type = "applikation / rss + xml" title = "RSS" href = "{RSS}" /> / head > body> {block: Posts} sektion>! - Alle posttyper tilføjes inden for Posts-blokken -> / sektion> blok: Posts} / body> / html>

Blokke

Ud over temavariablerne bruger Tumblr et system af blokke til at gengive blokke af HTML relateret til et specifikt datasæt, såsom indlæg, indlægstyper, tags og paginering.

Blokke bruges enten som betingede elementer, der kun gengives, hvis datatypen findes - {block: HasTags} - eller de fungerer som en sløjfe, der gengiver HTML for hvert af elementerne i blokken: {block: Tags}.

{block: HasTags} ul> {block: Tags} li> a href = "{TagURL}"> {Tag} / a> / li> {/ block: Tags} / ul> {/ block: HasTags}

Her er eksempler på grundlæggende tekst- og fotostillingsstrukturer, som du måske bruger til at oprette din skabelon. (Bemærk, at jeg bruger de nye HTML5-elementer, der gør HTML meget lettere at læse og dataattributter, der kan bruges som kroge til jQuery / JavaScript-manipulation af det tema, du vælger.)

Tekst:

{block: Text} artikel>! - Den valgfri tekstindlægs titelblok gengives, hvis der findes en titel -> {block: Title} header> h2> a href = "{Permalink}"> {Title} / a> / h2> / header> {/ block: Title} sektion> {Body} / sektion> {/ block: Text}

Foto:

{block: Photo} artikel> overskrift>! - Pak billedet med attributterne alt og highres i variabler for at gengive et link til indlægssiden -> {LinkOpenTag} img src = "{PhotoURL-500}" alt = "{ PhotoAlt} "data-highres =" {PhotoURL- HighRes} "/> {LinkCloseTag} / header>! - Hvis der findes en billedtekst, gengives billedteksten -> {block: Caption} sektion> {Caption} / sektion> {/ block: Caption} {/ block: Photo}

Få fart på alle de andre typer blokke, variabler og data for at skabe noget godt til din blog ved at gå her: tumblr.com/docs/da/custom_themes.

Se de 40 bedste Tumblr-blogs for designere på vores søsterside Creative Bloq.

Vi Råder Dig Til At Læse
Sådan mestrer du skærmretning med HTML5
Yderligere

Sådan mestrer du skærmretning med HTML5

Når du læ er en artikel på nettet eller bruger en indbygget applikation, vender martphone og tablet indholdet på kærmen, når du vipper dem i land kab, å du ikke beh&...
Kommercielt karakterdesign
Yderligere

Kommercielt karakterdesign

Når du opretter et tegn til brug i kommercielle omgivel er, er der et antal nøgleproblemer, der kal overveje . Afhængigt af klientkortet bliver du nødt til at pørge dig elv, h...
Kom godt i gang med Git-versionskontrol
Yderligere

Kom godt i gang med Git-versionskontrol

Hvi du nogen inde har modtaget en e-mail med en vedhæftet fil med titlen 'about_3_final_2.doc', er du muligvi ikke klar over det, men du har allerede brugt et meget grundlæggende (hv...