-->

Pages

29/03/2013

BLOGGER-VINKKI: KUVIEN REUNAT JA BLOGIN VARJOSTUKSET POIS



Kuvien reunojen poistamiseen on kyselty useaan kertaan vinkkiä. Homma on superhelppo: kopioi harmaalla pohjalla oleva koodi ja klikkaile itsesi Bloggerin mallin suunnittelutyökaluun. Valitse sieltä alin Lisää CSS -kohta ja liitä koodi sille varattuun kentään. Tallenna malli lopuksi. Tämä koodi poistaa varjot kaikista blogin kuvista profiilikuva mukaan lukien.


.post-body img, .post-body .tr-caption-container, .Profile img,
.Image img, .BlogList .item-thumbnail img {
    border: 0px;
    -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, .0);
    -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, .0);
    box-shadow: 0px 0px 0px rgba(0, 0, 0, .0);
    border-radius: 0px 0px 0px 0px;
    background: none;
}





Myös sivupalkkien ja postausosion välisten varjojen poistamisesta on kyselty. Nämä kun tulevat Bloggerin yksinkertaisessa mallissa annettuna tekijänä, eikä niitä saa poistettua tuolla mallin suunnittelutyökalussa. Ne saa hävitettyä seuraavasti:

1) Klikkaa Blogin takasivulla Malli > Muokkaa HTML-koodia
2) Paina CTRL+F (Macissa CMD+F) > hakutoiminnon pitäisi ilmestyä ruutuun
3) Etsi sanoilla Content Shadow Spread > pitäisi löytyä 3 osumaa
4) Näiden jokaisen perästä löytyy seuraavat kohdat:

default="40px" value="40px"
default="5px" value="5px"
default="10px" value="10px"

5) Nollaa jokainen luku ja kokeile esikatselulla, poistuivatko varjot.
6) Jos blogi näytti siltä kuin pitikin, tallenna asetukset lopuksi.

Muistakaa olla varovaisia HTML:n muokkaustilassa. Blogin koodista on hyvä ottaa varmuuskopio ennen muokkaamisen aloittamista. Käytä aina mallin esikatselua eläkä tallenna mitään ennen kuin olet varma, että koodi toimii haluamallasi tavalla.

Toivottavasti näistä on apua! Palataan taas uusiin vinkkeihin myöhemmin. :)

156 comments :

  1. Jes! Vihdoinkin sain ton tehtyä. SUURI KIITOS. Oot velho. Voisit laskuttaa meitä kaikkia ;)

    ReplyDelete
    Replies
    1. OLE HYVÄ! :-) Lasku tulee postissa.

      Delete
  2. Mä en edes oo tiennyt, että ne saa jotenkin pois. Jouduin kuvienkin leveyttä pienentämään, kun varjostus meni sivupalkkien päälle. Olin ku pieni lapsi jouluna, kun näin tän postauksen - KIITOS!!

    ReplyDelete
  3. KIITOS! itsehän en olisi edes tajunnut kysyä tällaista mutta sain jopa tehtyä tämän näillä ohjeilla :D aivan loistavaa!

    ReplyDelete
    Replies
    1. Ollos hyvä vain. :) Hyvä, että onnistui!

      Delete
  4. Ah, kiitos tästä! Tämän kanssa oon tuskaillu jo monta vuotta, ja näin helposti se lopulta luonnistui! :D Mahtavaa!

    ReplyDelete
  5. Kiitti vinkistä! Mäkään en ollut niitä reunoja enää pitkään aikaan ajatellut, vaikka ihan alunperin ne mua häiritsi. Ihanaa kun ne sai pois! :)

    ReplyDelete
    Replies
    1. Jotenkin tulee selkeyttä kuviin, kun reunukset häipyy. Kiva, että onnistuit näillä vinkein!

      Delete
  6. Kiitos ohjeista, heti tuli käyttöön!

    ReplyDelete
  7. Kiitos! Kuvien varjot olinkin jo saanut veke mutta nyt sain tuon postausosionkin varjon pois. Aah.. Iloista pääsiäistä! :)

    ReplyDelete
    Replies
    1. Samoin sinne, tai pääsiäisen loppuja! :]

      Delete
  8. Kiitoskiitoskiitos! Jopa amatööri osasi :D Tipunkeltaista pääsiäistä!

    ReplyDelete
    Replies
    1. Samoin sinne! :) Ole hyvä vaan!

      Delete
  9. Kiitos Kaisa, oot KIVA :)
    Aurinkoa sinne!

    ReplyDelete
  10. KIITOS! Ja kehykset veks. Mä olen tosi huono koodin muokkaamisessa ja CSS vie hermot, oon viimeksi koulussa kokeillut tehdä jotain. Tämä auttoi, superia!

    ReplyDelete
  11. Miten saat blogin otsikon noin alas?:)Miten olet tehnyt bannerin?

    ReplyDelete
    Replies
    1. Banneriin voi jättää kuvankäsittelyohjelmassa tyhjää tilaa yläpuolelle, jolloin sen saa ikään kuin tuolla tavalla alas.

      Delete
  12. kiiiiiiiitos ♥ JA ILOISTA PÄÄSIÄISTÄ!!!

    ReplyDelete
    Replies
    1. Takaisin! Ja koko kevättä, pääsiäistä on niin vähän enää jäljellä. :)

      Delete
  13. Hei mahtavaa! Mä en tajua CSS:stä yhtään mitään, joten ihan huippua saada valmiit ohjeet :) Jos saa vielä yhden toivomuksen esittää, niin kysyisin vinkkiä miten saa vaihdettua tekstin otsikon väriä?

    ReplyDelete
    Replies
    1. Tekstin otsikon väriä voi säätää tuolla Bloggerin mallin suunnittelutyökalussa kohdassa tekstin otsikko. Kokeiles sieltä!

      Delete
  14. Mutta mitäs sitten kun mulla on siellä nämä tekstit



    .date-header {
    margin-left:0px;
    }


    h3.post-title{
    margin-left:0px;
    }


    Ja sitten jos otan noi pois niin otsikko lähtee karkuun minne sattuu. Jos laitan ton varjo jutun noiden eteen niin ei tapahu mitään..

    Voi plääh.

    ReplyDelete
    Replies
    1. Koita siinä tapauksessa laittaa koodi suoraan html:ään. Etsi hakukomennolla kohta

      ]]></b:skin

      ja lisää harmaalla pohjalla oleva koodi tuon eteen. Pitäisi toimiä myös näin. (Muista olla varovainen html:n muokkaustilassa.)

      Delete
  15. Yay, kiitos! :) Hyvää pääsiäistä!

    ReplyDelete
  16. voi beibe, oot paras. Kiitos.

    ReplyDelete
    Replies
    1. <3 Ole hyvä. Kiva, jos oli apua.

      Delete
  17. Sä olet kyllä maailman ihanin "tekninen blogituki". :)
    Kiitos ihanuus.

    ReplyDelete
  18. Innostuin tutkimaan aiempia ohjeistuksiakin ja nyt on kaikki niin kuin olen toivonutkin! ♡ KIITOS! Ihan mahtavaa että teet näitä ohjeita niin että tyhmempikin ymmärtää. :)

    ReplyDelete
    Replies
    1. Kiva, että löyty vanhatkin vinkit ja vielä mukavampaa, jos niistä on ollut oikeasti apuja.

      Delete
  19. Kiitos, erittäin hyödyllinen ohje!

    ReplyDelete
  20. Minun blogger ei suostu päivittämään mitään uudistuksia mitä yritän tehdä?
    Ei onnistu edes otsikoiden/blogin nimen tm. värien muokkaus!
    Tahtoisi uudistusta, mutta blogger ei suostu yhteistyöhön kanssani.
    Missä vika, kun suksi ei luista?

    -Koo
    http://kotonaonkivempi.blogspot.fi

    ReplyDelete
    Replies
    1. No johan on kumma! :// Nyt kuulostaa jo sen sortin ongelmalta, että olisin sinuna suoraan Bloggerin ylläpitoon yhteydessä.

      Delete
  21. Ihan huippua!!! Iso kiitos täältäkin!!! :)

    ReplyDelete
  22. Kiitos taas, kuvasarjoista tuli heti paljon kivemman näköisiä! :)

    ReplyDelete
    Replies
    1. Joo sillä on jännä vaikutus, kun kehykset katoaa. :)

      Delete
  23. Oletpa kultainen, kiitos. :)

    ReplyDelete
  24. Saman saa helpommalla aikaan ihan ulkoasun asetuksista :P

    ReplyDelete
  25. VOI KIITOS KAISA <3 Ihanaaa että noin helpolla ne sai pois.. :D
    Hei, oisko sulla vinkkiä miten saan tekstit aina suoraan kuvan alle, kun ne tursuilee minne sattuu ja otsikotkin että alkaisivat kuvan alusta eikä enne kuvaa? ;D

    kiitän ja kumarran!!! :)

    ReplyDelete
    Replies
    1. Voisit suurentaa kuvia tekstin levyseksi? Se olis varmaan helpoin tapa, silloin ratkeais nuo molemmat probleemit. Ja toinen helppo tapa on muuttaa sivumarginaalien leveyksiä vähän suuremmaksi tuolta Bloggerin mallin suunnittelutyökalusta, se pakottaa tekstin kapeampaan laatikkoon.

      Delete
  26. Ja siis ihana blogi!! mahtavaa että löysin tänne! Upeita kuvia ja tunnelmia! <3

    ReplyDelete
    Replies
    1. Kiitosta! :) Kiva oli omasikin, sait uuden seuraajan! ;)

      Delete
  27. Hei kiitos, eka koodi joka oikeesti toimi! :-D Ihana blogi sinulla, eksyin tänne tänään. :)

    ReplyDelete
    Replies
    1. Kiva kuulla! :--) Ja vielä kivempi, kun oot eksyny tänne.

      Delete
  28. Kiitos tosi hyvästä neuvosta.
    Oot ihana.

    ReplyDelete
  29. KIIITTI TÄST OLI APUU!1 se toinen vinkki mis piti laittaa muokkaa html koodii se ja ettii joku ni ei toiminu enkä löytäny sit enää nii tää toimi, KIITOS! <3

    ReplyDelete
  30. Ihana, kun oot laittanut näitä vinkkejä. Apua on aloittavalle :)

    ReplyDelete
  31. Kiitoksia hyvistä ohjeista! Googletin apua ongelmaan ja löysin sinun blogisivuille. Kehysten poisto onnistui ohjeillasi helposti :)

    ReplyDelete
  32. Ihana blogi, kiitos vinkeistä! Etsin ja etsin tätäkin ja nyt se viimein löytyi! Sattuisitko tietämään, kuinka kaikista kuvista saa samanlevyiset? Pelleilin blogini ulkoasun kanssa enkä muistanut tallentaa koodeja, ja hävitin tuon muokkauksen...

    ReplyDelete
    Replies
    1. En nyt ulkoa muista sitä pakotuskoodia, mutta itse muokkaan kuvat samanlevyisiksi ennen julkaisemista. Että sillä tavalla ainakin! :)

      Delete
  33. Vautsi mikä blogi ja kuinka kullanarvoisia vinkkejä! Mä olen aloittelija näissä koodaushommissa ja kysynkin, onko sulla vinkkejä mistään sivuista mistä tän tyylisiä vinkkejä voisi löytää lisää vaikka englanniksikin?

    Ja toivomuksena esitän vaikkapa noiden instagram-pinterest-facebook-widgetien luomisen, miten niistä saa omannäköisiä ja tuollaisen sievän rykelmän? :)

    Kiitos avusta, pysyn linjoilla!

    Essi
    http://yearintheseshoes.blogspot.fi/

    ReplyDelete
    Replies
    1. Moikka! Ja kiitos! Kiva, kun olet klikkaillut tänne! :) En muista enää sivua, mistä tuon ohjeen löysin, mutta kuvakkeet tein itse Photoshopissa + toin ne vierekkäin ja linkitin kohteisiin. Ohjeita löytyy paljon englanniksi esimerkiksi goolaamalla blogger tips. Varo vaan, nuiden vinkkien syövereihin hukkuu ja kohta on vaikeuksia pitää blogi selkeänä. ;)

      Delete
  34. oot enkeli<3 kiitos paljon avusta :)

    ReplyDelete
    Replies
    1. Ole hyvä! :) Kiva, jos onnistui!

      Delete
  35. miks mulla ei onnistu tuo?:o jos kirjotan tuon Content "Shadow Spread" sinne hakukenttään nii ei tuu yhtään osumaa:(

    ReplyDelete
    Replies
    1. Moi! Johtunee siitä, että Blogger on tämän ohjeen jälkeen tiivistänyt html:ää. Koodin saa takaisin auki painamalla niitä pieniä nuolia koodin vasemmassa reunassa. Hakutoiminto ei taida löytää tekstiä piilotetuilta riveiltä.

      Delete
  36. Jee vihdoin määkin onnistuin! Kiitos superisti neuvosta! :)

    http://sannamarian.blogspot.fi

    ReplyDelete
    Replies
    1. Ole hyvä! Hyvältä näyttää blogissa!

      Delete
  37. Blogipulmia-blogin ohjeilla ei onnistu, mutta sun ohjeilla onnistuu aina :D Ehkä sie voisit alkaa pitää blogia näihin ongelmiin? ;) Mutta suurkiitos taas, selvisin pulmasta ohjeittesi avulla! ♥

    ReplyDelete
    Replies
    1. Kiva kuulla! Kiitos palautteesta. :)

      Delete
  38. apua jeejee oon ettinyt tätä kaikkialta! oot iiihan paras! <3

    http://storyofnea.blogspot.fi/

    ReplyDelete
  39. miks mulla ei toimi ): tai siis ne reunukset vaa pysyy tossa ):

    ReplyDelete
    Replies
    1. This comment has been removed by the author.

      Delete
    2. jes mää sain ton kiitti !

      Delete
  40. kiitti mua autto tosi paljon ! :)

    ReplyDelete
  41. Ahh ihanaa KIITOS! Tosi selkeet ohjeet, jopa minunkaltainen säheltäjä onnistui hommassa :) Sun blogi on muutenkin aivan mahtava, upeita kuvia!

    http://anna-secrets.blogspot.fi/

    ReplyDelete
  42. Kiitos Kaisa näistä avuista!! :)
    Olisko sulla vinkkiä että miten mä saisin noi gadgettien tsikot muutettua johonkin muunmalliseen tekstiin kuin mitä on bloggerissa valikoimissa ja mun blogista hävisi tekstien otsikot johonkin! APUA :D

    ReplyDelete
    Replies
    1. Ole hyvä Miiu! Apua, miten sää semmosen tempun onnistuit tekemään? :PP Gadgettien otsikot voi mm. vaihtaa kuvatiedostoihin, jolloin saa mitä vain fonttia/koukeroa/kuvia käyttöön.

      Delete
    2. This comment has been removed by the author.

      Delete
  43. Voi apua kiitos paljon! :)

    ReplyDelete
  44. mulla ei toimi! oikeesti nuo häirihtee ihan kamalasti, mut sillon ku lisäsin ton CCS:ssän ja painoin käytä blogissa, nii ei ollu tapahtunu mitää!

    ReplyDelete
    Replies
    1. :( No voi harmi, sitten en kyllä osaa auttaa. Googlaamalla löytyy varmasti monia eri tapoja toteuttaa sama asia, joten kannattaa kokeilla!

      Delete
  45. kiitos paljon :) ! vihdoin sain apua ongelmiin :D

    ReplyDelete
  46. Kiitos paljon avusta! Osaisitko muuten neuvoa, miten saa semmosen Instagram jutun blogiin, et siinä vaihtuis ne kuvat? :) Tai sit justiinsa joku ton tyyppinen pikku logo, kun sullakin on? :)

    ReplyDelete
    Replies
    1. Ole hyvä! En ole semmoseen ohjeeseen törmännyt, mutta varmasti sekin löytyy Googlen avulla. :)

      Delete
  47. Ihanaa että löysin ohjeesi! Pähkäilin tätä kuvien reuna -pulmaa yhdelle koodaajalle ja saan nyt kertoa löytäneeni ratkaisun! Kiitos :)

    sinisbluemoments.blogspot.com

    ReplyDelete
  48. Miks mulla ei toiminu toi kuvien kehysten poisottamis koodi? D___:

    ReplyDelete
    Replies
    1. Eikun kyllä se toimiiki ku laitoin uudellee :DD heh

      Delete
  49. Kiitti tosi paljon! Oli apua! Kiitoskiitoskiitos!

    http://lifeofsurprisess.blogspot.fi/

    ReplyDelete
  50. Mulla ei toimi tuo kehysjuttu :(


    > last-kiss-hurt.blogspot.fi

    ReplyDelete
  51. kiitos oikeesti <3 ! oon tuskaillu tän kaa jo kauan ja nyt sain vastauksen!!! (:

    ReplyDelete
  52. KIITOS! Oli paaaaljon apua :))

    ReplyDelete
  53. This comment has been removed by the author.

    ReplyDelete
  54. KIITOS AIVAN ÄLYTTÖMÄSTI<3

    ReplyDelete
  55. KIITOS KIITOS KIITOS KIITOS OOT KUN JOKU SUPERNAINEN TÄYDELLISTÄ JA IHANAA JA ´MHHMMHHM EN OSAA ENÄÄ SANOO MITÄÄN KUN KIITOS!<3

    ReplyDelete
  56. Kiitos tuhannesti! Mulla ei oo mikään muu tapa ikinä toiminut kun tää, tästä oli SUURI apu!

    ReplyDelete
  57. Isot kiitokset tästä! Ennen olen poistanut reunukset koodista, mutta nyt se ei toiminut. Tämä pelitti, kiitos! :)

    ReplyDelete
  58. Ei kyllä löytäny mitään tuommoisiin sanoihin liittyvää -> ei onnistunut:/

    ReplyDelete
    Replies
    1. Johan on kumma. Kokeilitko tuolla hakutoimminolla (muista klikata kursori html-kenttään ennen hakua, muuten ei etsi piilotetun koodin joukosta).

      Delete
  59. Kiitos iha HIRVEÄSTI! :) Olin 100 % varma, ettei tämä toimi, koska oon koittanut monta kertaa, mutta nyt koitin ja JES onnistu! Kiiitos ♥

    ReplyDelete
  60. Hei, kiitos ihan ÄLYTTÖMÄSTI ! <3 Ensimmäinen bloggaaja joka osasi selittää asian niin että minä ymmärsin, kiitoskiitoskiitos!

    ReplyDelete
  61. Oi kiitos, tästä oli apua hirveesti !! :) Ensimmäinen ohje joka mulla toimi!! Muutenkin oon sun blogista löytäny paljon ohjeita jotka todella toimivat !! :) KIITOS!!

    ReplyDelete
  62. Kiitos ihan HIRVEÄSTI tästä vinkistä ! :)

    ReplyDelete
  63. Minullapa ei tallennakaan tuota koodia jotta saan kehykset pois, miksi?

    ReplyDelete
  64. KIITOS TÄSTÄ ! toimi ihan mahtavasti :3

    ReplyDelete
  65. This comment has been removed by the author.

    ReplyDelete
  66. Olipa hyvä kun tämä ohje löytyi! Suuret kiitokset, pelastit miut ärsyyntymiseltä :-)

    ReplyDelete
  67. Ihan mahtavaa, viimeinkin sain ne raivostuttavat reunukset pois. Kiitos tuhannesti!!!

    ReplyDelete
  68. Kiitos tuhannesti!!!! Tämä auttoi minuakin noiden reunusten kanssa!
    Liityin myös ihanan blogisi lukijaksi :)

    ReplyDelete
  69. Kiitos avusta, muista blogeista apua etsittyäni jouduin pettymään (ei onnistunut) mutta sinun neuvosi avullapa onnistui! Kiitos! Ja niin kaunis blogi sinulla!<3

    ReplyDelete
  70. Miksi mulla toi content shadow spread anna mitään hakutuloksia? voitko auttaa?

    ReplyDelete
    Replies
    1. Muista klikata kursori html-kenttään ennen hakua, muuten ei etsi piilotetun koodin joukosta. Pitäisi auttaa. :)

      Delete
  71. Wau kiitos miljoonasti!

    daisy-beconfident.blogspot.com

    ReplyDelete
  72. Ihanaa, vihdoin sain tyhmät reunat pois, mutta miten kuvista saa tehtyä isoja? Minulle tulee isoimmaksi vaihtoehdoksi joku suuri kuva ja sen jälkeen normaalikokoinen kuva ja se on sitten jo liian iso? apua :((

    ReplyDelete
  73. Nii miten teen ton haun html-koodista? Mulla ei etsi sitä kohtaa, vaikka kirjoitan ton tekstin:(

    ReplyDelete