Pretty baby spin-doktorer http://1apotekonline.com/cialis/ sterling sølv pille kasse

Få en avatar framför kommentarerna på nya blogg.se

En funktion som har funnits sen starten av nya blogg.se är att man kan få en avatar intill de som har kommenterat och signerat med sitt eget blogg.se konto. Men, det är något som inte finns med automatik på alla stilmallar, utan bara på några av de nyare.

Så här kan det se ut:

utan avatar

avatar kommentar

Det är inte så svårt att lägga in detta på sin blogg ifall man inte har den funktionen just nu, och som vanligt tänkte jag visa er hur man gör.

1. Gå in på din blogg och gå in under kodmallar, välj kodmallen för inlägg.

2. Leta upp följande kodavsnitt:

<div class=”default”>Kommentarer </div>

{% for comment in comments %}
<div class=”commentheader”>
Postat av: {{ comment.name }}
</div>
<p class=”commenttext”>{{ comment.body }}</p>
<div class=”commentmeta”>

3. Kopiera följande kod:

{% if comment.avatar %}
   <img src="{{ comment.avatar }}" />
{% endif %}

4. Lägg in ovanstående kod under följande kodrad:

{% for comment in comments %}

kod kommentarsavatar

Publicera dina ändringar och gå vidare till nästa steg.

5. Kopiera följande kod:

.comment-avatar{
float: left;
margin: 5px;
}

6. Gå in i din stilmall och lägg in ovanstående kod längst ner och spara allt sen.

stilmall avatar

Nu så kommer alla som bloggar på blogg.se och som väljer att signera sin kommentar med hjälp av sitt konto att få en liten avatar intill sin kommentar.

Lätt va?

 

Från filmen:

Avatar i kommentarerna

Hej hörni.
Idag ska jag visa hur jag har gjort här på min bloggtips-sida för att få en avatar bredvid den personen som har kommenterat. Här ser ni till exempel Pontus som har en fotoblogg, då hamnar den bilden som han har laddat upp på sin blogg där och det fungerar ju bara med ny blogg.se så om jag skriver en kommentar här till exempel, testar lite, så kan jag inte fylla i namn och URL och så utan jag måste vara inloggad och skicka signerat som Sanna då och så rullar jag ner och då är jag där till exempel.

Det är det jag ska visa er idag helt enkelt. Ta den första koden som ligger här nedanför som heter kodmallskod, kod inte kol utan kod, gå in på design och redigera kodmallar och ta inlägg för det är ju på inläggssidan vi ska pilla lite nu. Bläddra ner så att du kommer till det stycket som heter comment-name eller postat av kan det också stå innan. Det ligger precis nedanför div class comment-header och du kan ju alltid söka på det genom att trycka control-f eller command-f om du har en MacBook eller en vanlig Mac. Så vi söker på det, så ska vi se här, comment.name, precis innan där så ska du alltså klistra in den koden som heter kodmallskod 1, så den klistrar du under här nere och sen är det bara att trycka på spara, publicera ändringar.

Då ser ni att jag gjort så här att det är width och height och där kan ni bestämma själva hur stora ni vill att de här bilderna ska vara, om det ska vara kvadratiska eller om de ska vara rektangulära. Problemet där är ju att bilderna är ju inte så stora i sig så man kan ju inte ha den hur stor som helst men i alla fall, sen har jag gjort så att jag har gjort en stilmallskod också, som då styr den här, vad heter det, bilden. Som ni ser här att jag har lagt en liten skugga och jag har lagt en liten ram runt. Så stilmallskoden som är där nere, ta den sen och så går vi in i stilmallen, redigera stilmall och så kan ni klistra in den längst ner, comment-avatar, klistra in den där och sen är det helt enkelt bara att leka med de här värdena som är här.

Margin är ju alltså hur långt det är mellan namnet och bilden, hur långt det är uppåt, hur långt det är åt sidan och hur långt det är neråt. Sen har vi den här moz box-shadow, box-shadow, det är ju alltså om det ska vara någon skugga på och det får man ju välja helt själv om man vill ha skugga eller inte och sedan så har vi de här border och då kan man ju välja vilken färg man vill ha. Jag har ju tagit en vit border men man behöver inte ha någon alls och vill man inte ha någon så är det ju noll man ändrar till där då och så är det ju margin och padding som man byter för att justera runt den här bilden. Alltså att den ska vara inåt, alltså inåt i sidan eller neråt i sidan eller mer åt höger eller vänster och så vidare. Ni vet hur margin och padding fungerar. Sedan om det ska vara till höger eller vänster och jag väljer ju vänster, jag tycker att det ser bäst ut men det får man ju självklart välja själv.

Det var det jag skulle visa er idag så, en snabbgenomgång då. Ta kodmallskoden och klistra in den där jag sa att den skulle vara inklistrad på inläggssidan och spara. Ta sedan stilmallskoden och lägg in den längst ner i stilmallen och justera värdena så som du vill ha dem och du kommer du, alla de personerna som kommenterar igen att trycka signerat som och så sin inloggning då, de kommer få en sådan här bild då om de har någon uppladdad. Sen kan det också bli så att har man nya blogg.se och man tar skicka signerat som och så sitt namn eller bloggnamn då, men man inte har en bild där, då blir det som en sådan här vanlig Facebook-bild ifall man inte har laddat upp någon, ja liknande det helt enkelt. Det är också ett tips som ni som vill kan använda på eran blogg för att göra den lite mer spännande. Ha det så bra. Hej hej.

Grundare av Designa Din Blogg. Drev den här sidan som ett hobbyprojekt under åtta år, numera har jag lämnat över ansvaret för DDB. Är pappa till Ludvig och make till Elin.

Läs mina andra inlägg

39 comments

  1. SvaraCajsa

    Yey tack för att du la upp detta! 😀 Trodde inte att du skulle se min kommentar om det! 🙂 Det kanske du inte gjorde heller men i mitt huvve såg du det och ba “Ja men det kan jag ju dela med mig av och berätta hur man gör” 🙂

    1. SvaraAlexa

      Jag såg just att jag inte ens har knappen “Logga in för att signera” på min blogg som alla andra har? Finns det någon kod för det?

  2. SvaraA

    Vore underbart om du kunde lista ut var man ändrar bakgrunden för mallen Silentium. Vill lägga in en egen bild som bakgrund, men färgkoden för bakgrunden finns ju ingenstans i den mallen!
    Header-koden lägger man in i kodmallen, men jag har letat bakgrund överallt men hittar inget som kan tänkas vara bakgrund. :/
    Provat lägga till en rad egen kod under “background” t.ex. men det gick inte (där ändrar man dessutom typsnittet för inläggen).. Ologiskt!

    1. SvaraVikkipedia

      Har du testat att lägga in den här koden i stilmallen/Css-mallen?

      body {
      background: #ccc url();
      background-repeat: no-repeat;
      background-position: center;
      background-attachment: fixed;
      }

      Testa med det. Annars kan det vara så att mallen är låst.

  3. SvaraFanny

    Hej; vet att du har mycket att stå i!.. Men jag desingar headers och bakgrunder till kompisar bland annat men nu skulle jag gärna vilja göra hela designer/ mallar. Det skulle vara super om du kunde lägga ut någon slags grund mall (med koderna) inte med fär koder eller så. Utan “rubrikerna” vad det är man ska skriva.;) Hoppas du förstår… skulle vara jättebra!

    Ps; Gillar verkligen denna sida ger mig super mycket hjälp!!!!!!!

  4. SvaraEmelie

    Hej! När jag lade in den här koden försvann alla mina inlägg så jag försökte reparera det och ta det tillbaka som det var från början. Jag har lyckats halft, det är bara det att alla kommentarer till det viktigaste inlägget jag har fortfarande är borta fastän kommentarerna syns på andra inlägg… Förstår verkligen inte, snälla hjälp mig? Mvh Emelie

  5. SvaraEllen

    Hej!

    Jag vet att du inte mår så bra & om du läser detta hoppas jag att det är bra med dig. Kämpa på, du kan vinna denna kampen !

    Om någon annan läser detta så har jag ett problem. I sidomenyn i min blogg, som jag designat jättefint, finns inte mina senaste inlägg, kategorier etc. med utan det är bara tomt under rubrikerna. Detsamma gäller under inläggen, där det brukar finnas datum, kommentarer m.m. Detta är väldigt störande då folk inte kan kommentera & jag har väldigt svårt att nå ett enskilt inlägg. Skulle förtvivlat gärna ha hjälp med detta, då jag inte har ändrat i mina kodmallar förutom lagt in en Bloglovin’-knapp & lite andra saker. Men jag har gjort det allt rätt & har också testat att återställa kodmallen – men ingenting händer. Är det någonting i min stilmall som är galet ?

    Kan tillägga att allt det syns (ibland) om jag ändrar något i stilmallen när ja förhandsgranskar, men när jag sparar & publicerar ändringar så är det borta.

    Skulle bli väldigt glad om någon ville hjälpa.

  6. SvaraJennie

    Hej,

    Tack för många bra förklaringar!

    Jag har en tilläggsfråga gällande kommentarer:

    Vart (om det går) redigerar man utseendet/fonten när man svarar på en kommentar? Det ser inge vidare ut nu 🙂

    Vänligen Jennie

      1. IDASWARDROBE.com

        Lägg till de här raderna i stilmallen – så gjorde jag iaf 🙂

        .response {
        font-family: verdana, arial, sans-serif;
        font-size: .60em;
        font-weight: normal;
        background-color: white;
        padding:5px;
        color: black;
        line-height: 130%;
        
        
        }
        
        
        .response-by {
        font-family: verdana, arial, sans-serif;
        font-size: .60em;
        font-weight: normal;
        background-color: white;
        padding:5px;
        color: black;
        line-height: 130%;
        
        
        }
        

        .response är det svar du skriver och .response-by är ditt namn som står under svaret.
        Hoppas det fungerar för er! 🙂

      2. IDASWARDROBE.com

        Kursivt får du genom att lägga till

        font-style: italic;
        

        bland de andra egenskaperna. Du kan t.ex. lägga in den raden sist, efter “line-height: 130%;”, men den måste ligga innan slutklammern, dvs innan detta tecken: }

        Lycka till!

  7. SvaraKatja

    Hej hej, jag skulle behöva hjälp med två grejjer och skulle uppskatta om du visste hur jag ska gå till väga.

    1. På höger sida i min blogg ligger ju kategorier osv, först undrar jag hur jag ska ändra färgen på texten “kategorier” till svart? Hur jag får ner den kolumnen till samma höjd som kolumnen där jag skriver inläggen är på? Och hur jag får bort “namn” “ålder” och “stad” + punkterna mellan dom tre. =)

    2. Går du in på ett inlägg där det finns kommentarer skriva och kollar dessa så ser det rent ut sagt förjävligt ut. Man ser inte vem som har skrivit vad och allt är bara rörigt, undrar därför om du vet hur jag organiserar så att det ser cleant och fint ut som resten av min blogg gör.

    PS. Temat jag har jobbat på är Dotty.
    Tack på förhand! =D

    1. Svarasvarar

      färg på menyrubriker ändrar du under

      .navheader {
      color: #fb0e77;

      färgkoden för svart är #000000;

  8. SvaraRebecka

    SNÄLLA DET HANDLAR EGENTLIGEN INTE OM DETTA MEN JAG ÄR HELT BEROENDE AV HJÄLP NU!!
    MIN HEADER HAR HAMNAT HELT FEL JAG M¨STE FÅ DEN CENTRERAD.

  9. SvaraErik

    Kanon! Har letat runt efter en lathund på hur man gör, tack! Gillar bloggen förövrigt. Lägger till den i min rss-läsare 🙂

  10. SvaraIda

    Hur kan man ta bort response-by namnet och ersätta med en egen logga. Det vill säga en färdig logga man gjort i photoshop, man vill använda den som signatur?????????

  11. SvaraEbba

    Heej jag undrar bara om du vet hur man tar bort eller ändrar

    Namn • Ålder • Stad

    på blogg designen dotty. Skulle bli tacksam för svar ganska snart… 🙂

    1. SvaraAlle

      Du går in på kodmallar, scrollar ner tills du ser , vid den delen letar du bland texten tills du ser orden Namn, Ålder och Stad, och då tar du bara bort dem 🙂

      1. Danisa

        Har samma problem men det finns inget som heter det. Har kollat i evigheter och sökt med men det finns inte.. :/

      2. Michaela

        Jag har äntligen hittat det! GÅ IN PÅ KODMALLAR
        (se till att du är i kodmallar och startsida)
        leta upp

        Namn • Ålder • Stad
        {{ profile.description }}

        sedan så får du ta bort eller ändra de du vill : ) Lycka till!

      3. Michaela

        oj de blev lite fel..
        Leeta upp

        Namn • Ålder • Stad
        {{ profile.description }}

      4. Michaela

        Jag har äntligen hittat det! GÅ IN PÅ KODMALLAR
        (se till att du är i kodmallar och startsida)
        leta upp

        
         &lt;div id=&quot;side&quot;&gt;
         &lt;br &gt;&lt;div class=&quot;nav&quot;&gt;&lt;strong&gt;&lt;P align=center&gt;&lt;font color=#2b2c27&gt;Namn&lt;/font&gt; &lt;font color=#dde0d5&gt;•&lt;/font&gt; &lt;font color=#2b2c27&gt;Ålder&lt;/font&gt; &lt;font color=#dde0d5&gt;•&lt;/font&gt; &lt;font color=#2b2c27&gt;Stad&lt;/font&gt;&lt;/P&gt;&lt;/strong&gt;
         &lt;br /&gt; &lt;P align=center&gt;&lt;font color=#282c2b&gt;{{ profile.description }}&lt;/font&gt;&lt;/font&gt;&lt;/FONT&gt;&lt;/P&gt;&lt;br /&gt;&lt;br /&gt;&lt;br/ &gt;&lt;/div&gt;
         &lt;div id=&quot;profile&quot;&gt;
        
        

        .
        sedan så får du ta bort eller ändra de du vill : ) Lycka till!

      5. Michaela

        hoppsan detta ska du leta upp!

        Namn • Ålder • Stad
        {{ profile.description }}

  12. SvaraMichaela

    Gå in på KODMALLAR ( se till att du är i startida)

    leta upp

    Namn • Ålder • Stad
    {{ profile.description }}

    ändra eller ta bort de du ska 🙂
    Lycka till!

  13. SvaraNicole

    Går det att göra att det kommer upp en vald bild även för dem som inte signerar med sitt blogg.se konto? Skulle vilja ha en avatar vid varje kommentar.

    Skulle vara super.

      1. Emma Hå

        På blogg.se-bloggar finns en stor knapp som brukar sitta precis bredvid “skicka kommentar”-knappen, där man kan välja att logga in på blogg.se för att “signera” med sin blogg.se-profil. Trots att jag har en blogg.se-blogg så har jag ingen sådan knapp, och jag hittar inget i kodmallarna för de färdiga bloggdesignerna som jag skulle kunna lägga till för att få dit den.

        //Emma Hå

      2. Sanna Preifelt

        Märkligt! Det kan vi tyvärr inte hjälpa till med då det inte går att styra från kodmallen, utan ligger bakom det man kommer åt, så tyvärr får du nog kontakta blogg.se i det ärendet. Lycka till!

Lämna ett svar

E-postadressen publiceras inte. Obligatoriska fält är märkta *