keskiviikko 15. heinäkuuta 2015

Mistä taustakuvia blogiin?

Alhaalla on linkkejä sivustoille, joista löytää taustakuvia blogiin. Kerron jokaisesta sivusta vähän jotain sille / sen kuville suosituksia tms. Kaikilta linkkaamiltani sivustoilta löytyy jatkuvia ja ilmaisia taustakuvia, mutten takaa, että jokainen sivun taustakuva olisi jatkuva ja ilmainen.

Subtle Patterns
- Helppokäyttöinen
- Yli 400 taustakuvaa

LeMog
- yli 3500 texturea eli tosi laaja valikoima
- suunniteltu lähinnä asuntojen ja alueiden mallinnukseen (laminaattilattia, kivetys jne.)

Vintage Backgrounds
-  Pieni mutta nätti valikoima

Tile-able Website Backgrounds
- Kaikki taustakuvat ovat jatkuvia

Päivitys 6.1.2016:

Patterns of change
- paljon erilaisia vaihtoehtoja

Vinkki! Valitessasi sopivaa taustakuvaa sen värisävyjä voi muuttaa sopiviksi jälkikäteen kuvanmuokkausohjelmalla, joten jos löydät muuten kivan taustakuvan, muttei sen värit miellytä, ongelma on korjattavissa!

*Lista päivittyy ajansaatossa

27 kommenttia:

  1. Sun blogista on ollut ihan kamalasti apua mulle! Kiitos!:) Mutta muutama ongelma mulla olisi, kun on tuo lukija gadet ja siinä sininen palkki jossa lukee "Liity tähän sivustoon" Niin olisiko sitä mahdollista saada pois? Mulla on nimittäin gadgeteissa semmonen kuva missä lukee että liity lukijaksi klikkaamalla, joten haluaisin sen sinisen pois;) ja että saako tuon alatunnisteen pois eli tuon harmaan palkin missä lukee "Malli: Picture Window. Palvelun tarjoaa Blogger." ja vielä muutama kysymys:D Saako noiden "vanhemmat tekstit" ja "uudemmat tekstit" tekstejen tilalle nuolet? Olin jossain näkevinäni:D Ja saako gadgetista pois noitantyökalujen kuvia;) toivon että ymmärsit ja vastaat!

    http://ookoononparelli.blogspot.fi/

    VastaaPoista
    Vastaukset
    1. kiitos paljon selma :) lukijapalkin voit poistaa menemällä blogiisi ulkoasuun, klikkaamalla lukijat-gadgettia ja painat vaan poista. harmaan palkin saa pois tällä koodilla:
      .footer-outer {
      background:none;
      box-shadow:none;
      }

      Vanhemmat ja uudemmat tekstien tilalle nuolet (teksti kopioitu aiemmasta samaa aihetta koskevasta vastauksestani)

      Ekaks sulla pitää olla ne kuvat, jotka haluat "uudemmat tekstit" ja "vanhemmat tekstit" -juttujen tilalle. Sitten kun sulla on ne netissä, mene Malli -> Mukauta -> Lisäasetukset -> Lisää CSS:ään alla olevat koodit:

      .blog-pager-older-link:after {
      content: url('NÄIDEN MERKKIEN SISÄÄN KUVAN URL-OSOITE');
      }

      .blog-pager-newer-link:before {
      content: url('NÄIDEN MERKKIEN SISÄÄN KUVAN URL-OSOITE');
      }

      #blog-pager a:link{
      color:transparent;
      }

      Toi eka koodi on se vanhempien tekstien koodi, eli siihen '-merkkien sisään laitat sen kuvan URL-osoitteen, jonka haluat korvaavan "vanhemmat tekstit" -tekstin.

      Toi toka koodi on taas se uudempien tekstien koodi, eli siihen '-merkkien sisään laitat sen kuvan URL-osoitteen, jonka haluat korvaavan "uudemmat tekstit" -tekstin.

      Ja lisäät nuo kaikki 3 koodia CSS:ään, niin pitäisi toimia :-)

      Poista
  2. Moikka!
    Ensinnä kiittäisin paljon vaivannäöstäsi tämän blogin kanssa, sillä tästä on ollut ihan älyttömästi apua omani muokkailussa ♥

    Sitten siihen pääasiaan... Tällä hetkellä blogissani sivut/ylävälilehdet ovat bannerin "päällä" (tehty postauksesi mukaan). Haluaisin ne blogin sivuun, ja niiden kanssa myös kuva kyseisestä aiheesta. Näin on mm. jillanblogi.blogspot.com :issa. Toivottavasti ymmärsit mitä tarkoitan D:

    oma blogini: withprinssi.blogspot.com

    VastaaPoista
    Vastaukset
    1. Enää välilehdet/sivut eivät ole bannerin "päällä", vaan ns. normaalisti. Tuota ongelmaani en kuitenkaan ole ratkaissut, mutta löysin uuden esimerkin: aadanhevoselamaa.blogspot.com

      Poista
    2. Kiitos paljon Senni :)!

      Elikkäs, sä tarviit ekaks ne kuvat, mitkä sä haluat näkyvän sivupalkissa. Sitten sun pitää ladata ne nettiin, esim. Photobucketiin (suosittelen itse). Seuraava juttu on, että luot sivun, jonne haluat päästä klikkaamalla sivupalkissa olevaa kuvaa. Kun olet luonut sivun, klikkaa "näytä" ja kopioi sivun osoite linkkikentästä. Sitten mene Ulkoasu -> lisää gadget -> HTML/JavaScript ja lisää sinne tässä postauksessa esiintyvä koodi: http://blogikoodeja.blogspot.fi/2013/10/kuvagadget-josta-paasee-johonkin.html?showComment=1430127755729#c2531676860273087386

      sitten vain teet ohjeiden mukaan ja pitäisi onnistua :-)

      Poista
  3. Moikka! Tutustuin vasta tänään sun blogiin, mutta nyt jo on ollut hirveästi apua! Kirjanmerkkeihinkin on tullut jo n. 20 erilaista koodia tallennettua tulevaisuuden varalle... :D Oot nähnyt varmasti aivan älyttömästi vaivaa näiden koodien kanssa, joten kiitän hyvin hyvin suuresti sua! Mulla on ilmennyt jo kysymyskin.. (Hmm.. muokkaan blogia, oikeastaan virtuaalitallia, puoli kaksi yöllä) Mulla on blogissa mallina matkailu, ja yhdessä niistä oli siksak yläreuna, josta on koitunut blogin reunoja pyöristäessä ongelma.. En nyt millään viitsisi lähteä tekemään uudelle pohjalle, joten toivoisin, että sen saisi kokonaan laitettua pois, tai sitten päädyn takaisiin kulmikkaaseen. :) Tässä vielä blogin osoite niin näät miltä tarkoitan: hepoluhdantalli.blogspot.fi

    VastaaPoista
    Vastaukset
    1. Ainiin ja samaan blogiin liittyen kysyisin kuinka gadgettien väleistä saa viivat pois, kun minulla ne oli valmiina? Kun lisäilin nimittäin kuvia, niin ongelmaksi muodostui erottimet ja haluaisin niiden olevan nätisti peräkkäin ilman yli määräisiä härpäkkeitä :D

      Poista
    2. SINUN EI TARVITSE VASTATA AIEMPIIN, SAIN RATKAISUN! Anteeksi muuten spämmi, tuli vahingossa kaksi! Ja anteeksi että ylipäätään vaivaan, sillä en tarvitse enää apua noissa kysymyksissä. Päädyin siis vaihtamaan vaihtamaan mallini Simpleen :) Mutta samalla tuli uusi ongelma.... Png kuvani ei näy sievuillani png:nä vaan normaaleina valkopohjaisina kuvina. Mitä pitäisi tehdä? Sillä ei olisi niin paljon väliä muuten, mutta en halua kuin joidenkin gadgettien väliin viivan, sillä haluan kuvien olevan peräkkäin. Laitoin sitten vain kuvan viivasta ilman otsikkoa, että saisin väli viivan, mutta nyt siitä näkyy varjolliset reunat ikävästi..

      Poista
    3. kiitos paljon anonyymi :)! ei haittaa, poistin toisen kommenteistasi :)
      onko png-kuvissasi valkoinen pohja / oletko poistanut valkoista pohjaa ja muuttanut sitä transparentiksi (=läpinäkyvä)? jos et, valkoinen tausta pysyy kuvassa.

      Poista
  4. Pakko sanoa sulle iso ja lämmin kiitos! Oon selaillut tätä blogia jonkun aikaa ja löytänyt vaikka mitä kivaa kokeiltavaa omaankin blogiin. Tällainen urpo, joka ei yleensä tekniikasta kamalasti tajua, on saanut muokattua blogia kivempaan suuntaan :) Joten iso kiitos! Näät varmasti paljon vaivaa ja oot selvästi auttanut jo monia ihmisiä! <3

    VastaaPoista
  5. Moi! Mistähän mahtais johtua kun mun blogissa ei enää mitkään html koodit toimi? Kokeilin samoja koodeja toisessa blogissa ja siellä toimi hyvin. Oisko se css osio jotenkin jumittanut, koska se on aika täynnä noita koodeja? :D Ois nimittäin kiva saada tää pian toimimaan, en pysty muuten tekemään mitään muutoksia blogiini.

    http://moveawaysanna.blogspot.fi/

    (poistin tämän saman kommentin, mutta et siihen vastannut, joten pistän tämän saman kommentin nyt tähän uusimpaan postaukseen)

    VastaaPoista
    Vastaukset
    1. Tähän on olemassa monia syitä, joista kerron nyt kaksi (joilla on lähestulkoon sama ratkaisu).

      1. Olet lisännyt koodin HTML:ään. CSS-koodiboksi mallinsuunnittelutyökalu ei tykkää tästä ollenkaan (en tiedä miksi), ja näin jostain syystä kaikki mahdollisuudet muokata blogia CSS:stä käsin ovat tipotiessään, sillä vaikka CSS:ään syöttäisi koodeja, ne eivät pelaa toivotulla tavalla.

      2. Olet liittänyt CSS:ään virheellisen koodin, joka ei yksinkertaisesti toimi (mahdollisesti jokin merkki kuten } unohtunut). CSS ei tykkää, ja CSS-osio jumittuu sanojesi mukaan.

      RATKAISU
      1. Mene mallinsuunnittelutyökaluun ja vaihda mallia TAI klikkaa vanhaa malliasi uudelleen, jotta kaikki muutokset aiempaan malliin häviävät. Ikävä toimenpide, mutta todella hyödyllinen ja auttaa yleensä kaikissa tapauksissa :)!

      Poista
  6. Kiitos mielettömästi ensinäkin upeasta blogista mistä on niin mielettömästi ollut apua :-)
    Kysymys olisi kuitenkin sellainen, että miten saan keskitettyä tuon gadgetin missä on sulla esimerkiksi tuo "1 apua tarvitseva"? Samoin some-ikoneiden keskittäminen mietityttää. Yksinkertaisesti siis HTML/JavaScript gadgettien sisällön keskittäminen, sillä mulla ne on ihan vasemmassa reunassa. En tiiä saitko nyt selvää mitä oikein hain asiallani takaa :s

    VastaaPoista
    Vastaukset
    1. Kiitos anonyymi:)!

      lisäät vain html/javascript gadgettien koodin alkuun ja loppuun < center > yhteen kirjoitettuna :-)

      Poista
    2. Kiitos paljon, auttoi! :)

      Poista
  7. Hei, ja suuri kiitos minunkin puolestani näistä mahtavista sivuista! Täältä on löytynyt vastaus lähes kaikkeen, mitä olen halunnut sivuilleni tehdä!

    Mutta asiaan: Tiedätkö miten gadgetin otsikon ja gadgetin sisällön väliä saisi pienennettyä?

    VastaaPoista
    Vastaukset
    1. Kiitos paljon, Hopeapolku :-)!

      lisää tää koodi CSS:ään:

      h2 {
      margin-bottom: -20px;
      }

      ja muuta lukua 20 mieleiseksesi :)

      Poista
  8. Heippa! Olisiko sellaista koodia kun varjon lisää kuviin niin ei kuvan kehykset näkäysi ? Mulla on jo koodi millä lähtee kuvista kehykset pois, mutta kun lisään sen varjostus koodin niin kehykset näkyy:/.. Toivottavasti ymmärsit !

    http://salopellontellu.blogspot.fi/

    VastaaPoista
    Vastaukset
    1. Moi! Jos olet nämä kaksi koodia blogiisi lisännyt niin pitäisi onnistua mallilla kuin mallilla:


      .post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
      .BlogList .item-thumbnail img {
      padding: 0px;
      background: #ffffff;
      border: 0px solid #eeeeee;
      -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .0);
      -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .0);
      box-shadow: 1px 1px 1px rgba(0, 0, 0, .0);
      }


      .post-body img, .post-body .tr-caption-container {
      padding: 0px;
      border: none;
      background: transparent;
      box-shadow: 1px 1px 10px rgba(0, 0, 0, .8);
      }

      Poista
  9. Miksi mulla ei toimi vanhemmat ja uudemmat linkki? Miten saada toimimaan?

    http://diconomise.blogspot.fi/

    VastaaPoista
    Vastaukset
    1. Jokin koodi (luultavasti sellainen, joka ei toimi oikein) jumituttaa ne. Suosittelen nollaamaan tämänhetkiseen malliisi tekemät muutokset ja klikkaamana / valitsemaan uuden mallin.

      Poista
  10. Hei, mitenkä saisi gadgetit bannerin viereen? Siis kaikki, koko konkkaronkka :D
    Siis näin-> http://i.imgur.com/Jq2bxXi.png

    VastaaPoista
    Vastaukset
    1. Moi! Lisää tämä koodi blogisi CSS:ään ja muuta numeroa haluamasi mukaan:
      .sidebar{
      margin-top: -320px;
      }

      Poista
    2. Kiitos todellapaljon! :)
      Tästä blogista on ollut todellapaljon apua ja hyötyä oppia koodaamaan ja muokkaamaan näitä ulkoasuja. Kiitos vielä kerran :)

      Poista
  11. Kirjoittaja on poistanut tämän kommentin.

    VastaaPoista

MUISTA LINKATA BLOGISI !! -> näin ongelman ratkominen / auttaminen osaltani onnistuu parhaalla mahdollisella tavalla! :-)