Malli -> Mukauta -> Lisää CSS:ään alla oleva koodi:
.post-body {
margin-top: -20px;
}
Jos haluat pienentää blogitekstin otsikon ja blogitekstin väliä, lihavoidun punaisen luvun tulee olla miinuksen puolella eli esim. -10 tai vaikka -55. Jos haluat suurentaa väliä, luvun pitää olla positiivinen eli esim. 10 tai 55.
lauantai 30. elokuuta 2014
tiistai 19. elokuuta 2014
Some-ikonit blogin sivupalkkiin
Postausta some-ikoneista toivottiin, joten otin toiveen kuuleviin korviini ja tadaa, tässä olisi postausta some-ikoneista. Kaikille sana ei välttämättä ole tuttu, joten havainnollistetaan some-ikoneja kuvan kanssa:
Some-ikonit ovat siis esimerkiksi blogissa toimivia kuvakkeita blogin sivupalkissa, ja yleensä kuvakkeita klikkaamalla pääsee johonkin sivuun, jonka logo on some-ikonissa. Esimerkkinä voisi mainita kysymysmerkin (joka voi johtaa esim. ask.fm:ään tai bloggaajan esittelysivulle tms.) tai Facebookin logon.
MISTÄ SAA SOME-IKONEJA?
Some-ikoneja saa netistä vaikka mistä, mutta ainakin ilmaisena niitä saa täältä eli iconfinderistä. Sivuston lisensseihin en ole perehtynyt eli en siis tiedä, saako kaikkia ikoneita käyttää vaikkapa blogissa. Lisensseihin perehtyminen todellakin on oma paheeni, mutta ei puhuta siitä nyt :-D
MITEN ICONFINDERIÄ KÄYTETÄÄN?
Iconfinder on omasta mielestäni simppeli ja helppokäyttöinen, mutta ihan varmuuden vuoksi ajattelin laittaa mielestäni tärkeimmät asiat tähän postauksen osaan kuvien muodossa.
Alla olevassa kuvassa on screenshot Iconfinderistä. Violetilla on ympäröity kohta, johon olen kirjoittanut englanniksi asian, josta olen halunnut some-ikonin. Punaisella ympäröity kohta on Free eli ilmainen, jolloin sivu on suodattanut ainoastaan ilmaiset ikonit koneeni näytölle. Mikäs siinä, jos on valmis maksamaan ikoneista, mutta itse olen löytänyt Iconfinderistä paljon hyviä ikoneita ihan ilmaiseksi.
Seuraavassa alla olevassa kuvassa olen valinnut ikonin, jonka olen halunnut ladata koneelleni ja viedä myöhemmin blogini sivupalkkiin. Tärkeimmät asiat tuosta kohdasta olen ympäröinyt punaisella ja violetilla. Punaisella ympäröity kohta on kohta, josta painamalla saat kuvakkeen ladattua koneellesi. Violetilla olen ympäröinyt valittavissa olevat kokovaihtoehdot: useista ikoneista olen löytänyt laajat kokomahdollisuudet. Jos haluat monta ikonia ja ne blogisi sivupalkkiin, suosittelen valitsemaan koon 48 tai 64. Kokoa voi myös muokata ikonin ladattua esimerkiksi Paintissa.
MITEN SOME-IKONIN SAA BLOGIIN
1. Kun olet ladannut some-ikonit koneellesi, sinun pitää ladata ikonit jollekin nettisivustolle esim. Photobucketiin tai Flickriin. Tässä postaus Photobucketin kautta kuvan lataamisesta ja linkittämisestä (!! tärkeä !!)
2. Ulkoasu -> Lisää gadget -> Lisää HTML/JavaScript
3. Jos sinulla on monta some-ikonia, jotka haluat vierekkäin blogisi sivupalkkiin, tarvitset jokaiselle ikonille tämän koodin: <a href="TÄHÄN SIVUSTON OSOITE,JOHON IKONIA KLIKKAAMALLA PÄÄSEE"_blank"><img src="TÄHÄN SOME-IKONIN KUVAN OSOITE" border="0" /></a> Sinun pitää laittaa kaikki koodit yhteen gadgettiin tai niin minä ainakin suosittelen. Alla oleva kuva havainnollistaa tätä juttua:
Kuvassa on siis kolme koodia samassa gadgetissa. Koodit kannattaa erottaa toisistaan kahdella enterillä. Huomaa, että nettisivuston, jolle some-ikoni vie, pitää olla http-muodossa eikä www-muodossa, niin kuin kuvassa on !! Eli tässä muodossa: https://www.flickr.com/
4. Sitten vain tallennat ja esikatselet, miellyttääkö some-ikonien järjestys, värit ja paikka sivupalkissa silmääsi.
Toivottavasti tämä tekniikka toimii teillä! Ja jos ei toimi, ilmoitelkaa ihmeessä asiasta tämän postauksen kommenttiboksiin.
Some-ikonit ovat siis esimerkiksi blogissa toimivia kuvakkeita blogin sivupalkissa, ja yleensä kuvakkeita klikkaamalla pääsee johonkin sivuun, jonka logo on some-ikonissa. Esimerkkinä voisi mainita kysymysmerkin (joka voi johtaa esim. ask.fm:ään tai bloggaajan esittelysivulle tms.) tai Facebookin logon.
MISTÄ SAA SOME-IKONEJA?
Some-ikoneja saa netistä vaikka mistä, mutta ainakin ilmaisena niitä saa täältä eli iconfinderistä. Sivuston lisensseihin en ole perehtynyt eli en siis tiedä, saako kaikkia ikoneita käyttää vaikkapa blogissa. Lisensseihin perehtyminen todellakin on oma paheeni, mutta ei puhuta siitä nyt :-D
MITEN ICONFINDERIÄ KÄYTETÄÄN?
Iconfinder on omasta mielestäni simppeli ja helppokäyttöinen, mutta ihan varmuuden vuoksi ajattelin laittaa mielestäni tärkeimmät asiat tähän postauksen osaan kuvien muodossa.
Alla olevassa kuvassa on screenshot Iconfinderistä. Violetilla on ympäröity kohta, johon olen kirjoittanut englanniksi asian, josta olen halunnut some-ikonin. Punaisella ympäröity kohta on Free eli ilmainen, jolloin sivu on suodattanut ainoastaan ilmaiset ikonit koneeni näytölle. Mikäs siinä, jos on valmis maksamaan ikoneista, mutta itse olen löytänyt Iconfinderistä paljon hyviä ikoneita ihan ilmaiseksi.
Seuraavassa alla olevassa kuvassa olen valinnut ikonin, jonka olen halunnut ladata koneelleni ja viedä myöhemmin blogini sivupalkkiin. Tärkeimmät asiat tuosta kohdasta olen ympäröinyt punaisella ja violetilla. Punaisella ympäröity kohta on kohta, josta painamalla saat kuvakkeen ladattua koneellesi. Violetilla olen ympäröinyt valittavissa olevat kokovaihtoehdot: useista ikoneista olen löytänyt laajat kokomahdollisuudet. Jos haluat monta ikonia ja ne blogisi sivupalkkiin, suosittelen valitsemaan koon 48 tai 64. Kokoa voi myös muokata ikonin ladattua esimerkiksi Paintissa.
MITEN SOME-IKONIN SAA BLOGIIN
1. Kun olet ladannut some-ikonit koneellesi, sinun pitää ladata ikonit jollekin nettisivustolle esim. Photobucketiin tai Flickriin. Tässä postaus Photobucketin kautta kuvan lataamisesta ja linkittämisestä (!! tärkeä !!)
2. Ulkoasu -> Lisää gadget -> Lisää HTML/JavaScript
3. Jos sinulla on monta some-ikonia, jotka haluat vierekkäin blogisi sivupalkkiin, tarvitset jokaiselle ikonille tämän koodin: <a href="TÄHÄN SIVUSTON OSOITE,JOHON IKONIA KLIKKAAMALLA PÄÄSEE"_blank"><img src="TÄHÄN SOME-IKONIN KUVAN OSOITE" border="0" /></a> Sinun pitää laittaa kaikki koodit yhteen gadgettiin tai niin minä ainakin suosittelen. Alla oleva kuva havainnollistaa tätä juttua:
Kuvassa on siis kolme koodia samassa gadgetissa. Koodit kannattaa erottaa toisistaan kahdella enterillä. Huomaa, että nettisivuston, jolle some-ikoni vie, pitää olla http-muodossa eikä www-muodossa, niin kuin kuvassa on !! Eli tässä muodossa: https://www.flickr.com/
4. Sitten vain tallennat ja esikatselet, miellyttääkö some-ikonien järjestys, värit ja paikka sivupalkissa silmääsi.
Toivottavasti tämä tekniikka toimii teillä! Ja jos ei toimi, ilmoitelkaa ihmeessä asiasta tämän postauksen kommenttiboksiin.
Tunnisteet:
gadget,
HTML/JavaScript,
photobucket,
some icons,
toivepostauksia
maanantai 11. elokuuta 2014
Navigaatipalkin poistaminen & siitä aiheutuvan tyhjän tilan deletoiminen + infoa
MITEN POISTAT NAVIGOINTIPALKIN?
- Mene ulkoasuun, sieltä klikkaa navigointipalkin muokkaa-kohtaa, rullaa alas ja kliksuta "ei käytössä" -nappulaa. Sitten vain suoritat tallennukset. Alla oleva kuva havainnollistaa.
Kun navigointipalkin poistaa, palkki jättää blogiin tyhjän tilan. Suunnilleen samalta pitäisi näyttää blogissasi kuin alla olevassa kuvassa:
Jos ylimääräisen tilan haluaa pois, lisää tämä koodi blogisi CSS:ään:
.content-inner {
margin-top: -30px;
}
Ja tältä näyttää, kun koodin lisää:
Tästä aiheesta pyydettiin postausta, joten tein sen ilomielin. Ilmoitelkaa ihmeessä jatkossakin teidän mieltä askarruttavia blogiongelmia! Yritän toteuttaa niitä, kun multa löytyy sopivasti aikaa. Haha, onneksi eka jakso ei ole tiukka :)!
- Mene ulkoasuun, sieltä klikkaa navigointipalkin muokkaa-kohtaa, rullaa alas ja kliksuta "ei käytössä" -nappulaa. Sitten vain suoritat tallennukset. Alla oleva kuva havainnollistaa.
Kun navigointipalkin poistaa, palkki jättää blogiin tyhjän tilan. Suunnilleen samalta pitäisi näyttää blogissasi kuin alla olevassa kuvassa:
Jos ylimääräisen tilan haluaa pois, lisää tämä koodi blogisi CSS:ään:
.content-inner {
margin-top: -30px;
}
Ja tältä näyttää, kun koodin lisää:
Tästä aiheesta pyydettiin postausta, joten tein sen ilomielin. Ilmoitelkaa ihmeessä jatkossakin teidän mieltä askarruttavia blogiongelmia! Yritän toteuttaa niitä, kun multa löytyy sopivasti aikaa. Haha, onneksi eka jakso ei ole tiukka :)!
Tunnisteet:
CSS,
koodi,
navigaatiopalkki,
toivepostauksia,
välin pienentäminen,
välit
sunnuntai 27. heinäkuuta 2014
Tästä alkaa blogilla tienaaminen!
Olette ehkä huomanneet blogissani mainostusbannereita. Ei, en ole ottanut kauppoihin mitään yhteyttä yhteistyökumppanuuden merkeissä vaan liityin TradeTracker Finlandin kumppanuusmarkkinointiyhtiöön julkaisijaksi. Asiasta puhutaan myös Affliate-markkinointina. Aihe ei varsinaisesti liity blogikoodeihin tai ulkoasuneuvoihin (joita blogini on tähän asti postauksissaan käsitellyt), mutta kuitenkin eräänä osana bloggaamiseen, josta on takuulla iloa ja totta kai rahallista hyötyä, mikäli kaipaa lisää paksuutta lompakkoonsa. Kuten minäkin, hih. Mutta hei, nyt teitä varmasti kummastuttaa koko asia, sillä suuri osa teistä on tuskin TradeTrackerista kuullutkaan. Jos haluatte kuulla asiasta tarkemmin, jatkakaa ihmeessä lukemista.
Tässä on suoralainaus TradeTrackerin sivuilta: "TradeTracker tarjoaa verkossaan oleville julkaisijoille mahdollisuuden ansaita tuloja verkkosivustoiltaan. Tämä on mahdollista mainostamalla TradeTrackerin välittämien ainutlaatuisten mainostajien kampanjoita."
Yksinkertaistettuna homma toimii niin, että a) sinulla on jokin nettisivusto, esimerkiksi blogi b) rekisteröidyt ilmaiseksi TradeTrackeriin julkaisijaksi (=julkaiset sivustollasi yhden tai monen nettisivun, yleensä nettikaupan, mainoksia) & c) alat julkaisemaan TradeTrackerin 384 laajan mainostajan valikosta jotain/joitakin mainoksia nettisivustollasi. Eri mainostajilla on eri tapoja antaa julkaisijalle rahaa yrityksen mainoksista: jotkut antavat sentin pari PELKÄSTÄ MAINOKSEN KLIKKAUKSESTA (helppoa tienaamista kuin mikä, makoiletpa sitten sängynpohjalla!) jotkut mainoksen klikkaamisesta, joka johtaa jonkin yrityksen tuotteen ostopäätökseen. Tapoja tienata TradeTrackerin mainostusportaalilla on muitakin, mutta nuo kaksi ovat helpoimmat ymmärtää - ainakin itselleni :-D.
MIKSI VALITA TRADETRACKER?
- Saat itse valita mainokset 384 mainostajan valikosta, mitkä lisäät blogiisi. Tämä helpottaa tienaamista - jos sinulla on vaikkapa muotiblogi, voit lisätä blogiisi mainoksia nettivaatekaupoista. Tämä toiminto eroaa esimerkiksi Googlen AdSensestä, jossa Google itse päättää, mitä mainoksia blogissasi näyttää. Lisäksi olen kuullut AdSenstä roiman määrän huonoa palautetta...
- Oletteko koskaan kuvitelleet rahan ansaitsemisen olevan näin helppoa? Eihän bloggaamisella rikastu kuin vain harvat ja valitut, mutta pienikin taskuraha ilman varsinaista työntekoa kuulostaa hyvältä vaihtoehdolta. Rahaa ilman raatamista. Sounds great, eikö?
- Liittyessä saa 10€:n alkusumman TradeTracker-tilillesi. Sekin kuulostaa mainiolta! Ja tosiaan, TradeTracker eikä sen mainostajatkaan velota julkaisijoilta lantin lanttia. Rahan tuloa ei voi estää, vai kuinka?
- Kokeilun arvoinen projekti, ja vaikka tienaamisesi jäisi muutaman euron lukemiin, et häviä mitään. Paitsi miinuksena toki se, että TradeTracker-tililläsi pitää olla vähintään 25€ ennen summan siirtämistä tilille.
Alla olevaa banneria klikkaamalla voit liittyä TradeTrackerin jäseneksi ja ansaita 10€ euron pohjamunan julkaisijaurallasi. Helppoa, turvallista ja hyödyllistä - kukapa ei kaipaisi näin helppoa rahaa itselleen :-D (jos en ihan väärin ymmärtänyt, klikkaamalla blogissani olevia TradeTrackerin mainoksia ja liittymällänne sitä kautta TradeTrackerin julkaisijaksi, saan siitä pienen ansion myös itselleni.)
Hei, kertokaa ihmeessä kokemuksianne affliate-mainonnasta ja TradeTrackerista, jos tähän tapaan päädytte / olette jo päätyneet! Mä tulen kertomaan jossain vaiheessa tarkemmin, miten bloggaamisella tienaaminen lähtee käyntiin ja jääkö tästä käteen vaan pariin muumitikkariin riittävät tuotot vai tosiaan isommatkin summat. (:
Tässä on suoralainaus TradeTrackerin sivuilta: "TradeTracker tarjoaa verkossaan oleville julkaisijoille mahdollisuuden ansaita tuloja verkkosivustoiltaan. Tämä on mahdollista mainostamalla TradeTrackerin välittämien ainutlaatuisten mainostajien kampanjoita."
Yksinkertaistettuna homma toimii niin, että a) sinulla on jokin nettisivusto, esimerkiksi blogi b) rekisteröidyt ilmaiseksi TradeTrackeriin julkaisijaksi (=julkaiset sivustollasi yhden tai monen nettisivun, yleensä nettikaupan, mainoksia) & c) alat julkaisemaan TradeTrackerin 384 laajan mainostajan valikosta jotain/joitakin mainoksia nettisivustollasi. Eri mainostajilla on eri tapoja antaa julkaisijalle rahaa yrityksen mainoksista: jotkut antavat sentin pari PELKÄSTÄ MAINOKSEN KLIKKAUKSESTA (helppoa tienaamista kuin mikä, makoiletpa sitten sängynpohjalla!) jotkut mainoksen klikkaamisesta, joka johtaa jonkin yrityksen tuotteen ostopäätökseen. Tapoja tienata TradeTrackerin mainostusportaalilla on muitakin, mutta nuo kaksi ovat helpoimmat ymmärtää - ainakin itselleni :-D.
MIKSI VALITA TRADETRACKER?
- Saat itse valita mainokset 384 mainostajan valikosta, mitkä lisäät blogiisi. Tämä helpottaa tienaamista - jos sinulla on vaikkapa muotiblogi, voit lisätä blogiisi mainoksia nettivaatekaupoista. Tämä toiminto eroaa esimerkiksi Googlen AdSensestä, jossa Google itse päättää, mitä mainoksia blogissasi näyttää. Lisäksi olen kuullut AdSenstä roiman määrän huonoa palautetta...
- Oletteko koskaan kuvitelleet rahan ansaitsemisen olevan näin helppoa? Eihän bloggaamisella rikastu kuin vain harvat ja valitut, mutta pienikin taskuraha ilman varsinaista työntekoa kuulostaa hyvältä vaihtoehdolta. Rahaa ilman raatamista. Sounds great, eikö?
- Liittyessä saa 10€:n alkusumman TradeTracker-tilillesi. Sekin kuulostaa mainiolta! Ja tosiaan, TradeTracker eikä sen mainostajatkaan velota julkaisijoilta lantin lanttia. Rahan tuloa ei voi estää, vai kuinka?
- Kokeilun arvoinen projekti, ja vaikka tienaamisesi jäisi muutaman euron lukemiin, et häviä mitään. Paitsi miinuksena toki se, että TradeTracker-tililläsi pitää olla vähintään 25€ ennen summan siirtämistä tilille.
Alla olevaa banneria klikkaamalla voit liittyä TradeTrackerin jäseneksi ja ansaita 10€ euron pohjamunan julkaisijaurallasi. Helppoa, turvallista ja hyödyllistä - kukapa ei kaipaisi näin helppoa rahaa itselleen :-D (jos en ihan väärin ymmärtänyt, klikkaamalla blogissani olevia TradeTrackerin mainoksia ja liittymällänne sitä kautta TradeTrackerin julkaisijaksi, saan siitä pienen ansion myös itselleni.)
Hei, kertokaa ihmeessä kokemuksianne affliate-mainonnasta ja TradeTrackerista, jos tähän tapaan päädytte / olette jo päätyneet! Mä tulen kertomaan jossain vaiheessa tarkemmin, miten bloggaamisella tienaaminen lähtee käyntiin ja jääkö tästä käteen vaan pariin muumitikkariin riittävät tuotot vai tosiaan isommatkin summat. (:
Tunnisteet:
Affliate-mainonta,
Helppoa tienaamista,
TradeTracker
lauantai 26. heinäkuuta 2014
Ratkaisuja blogin pyöristämisestä koituviin ongelmiin
Blogin kulmien pyöristämisestä koituu monelle bloggaajalle ongelmia, joihin niksiä voi olla itse vaikea ratkoa. Viime aikoina mulle on tullut paljon kysyttävää juurikin pyöristämisen koodista johtuvista ongelmista. Ongelmia, joita kulmien pyöristämisestä saattaa koitua, on monia, joten olen koonnut tähän postaukseen ikään kuin ensiapupaketin, jolla voitte yrittää ratkoa ongelmaanne. Tässä vielä linkki kulmien pyöristämispostaukseen: http://blogikoodeja.blogspot.fi/2013/10/blogin-kulmien-pyoristaminen.html
ONGELMA 1 ~ BANNERISTA AIHEUTUNEET PUSKEVAT KULMAT
ONGELMA 1 ~ BANNERISTA AIHEUTUNEET PUSKEVAT KULMAT
Kulmia pyöristäessä voi tulla ylläolevan kuvan osoittama tilanne vastaan: pyöristetyistä kulmista törröttää valkoiset (toki voi olla myös muunväriset) kulmat. Tässä tapauksessa törröttävät kulmat johtuvat bannerista, jonka kulmia ei ole pyöristetty. Pyöristyskoodi itsessään ei pyöristä banneria, joten suorakulmion muotoinen banneri voi helposti pompata esiin pyöristetyistä kulmista.
Miten korjata ongelma?
- Pyöristä bannerisi kulmat jollakin kuvankäsittelyohjelmalla, esimerkiksi netistä ladattavalla ilmaisella Photoscapella tai netissä käytettävällä Picmonkeyllä klikkaamalla kohtaa "Rounded Corners". IPiccyllä voit esimerkiksi poistaa kaikki ylimääräiset kohdat tekemällä ne läpinäkyviksi kohdasta "Erase Background".
- Voit myös yrittää saada kulmat banneria siirtämällä / blogia leventämällä / molemmilla syrjään.
Kun lisäät tämän koodin CSS:ään, saat banneria siirtymään vasemmalle:
.header-outer {
margin-left: 20px;
}
margin-left: 20px;
}
Lukua 20 voit muuutaa mieleisesi mukaan.
Kun lisäät tämän koodin CSS:ään, saat banneria siirtymään alaspäin:
.header-outer {
margin-top: 20px;
}
margin-top: 20px;
}
Lukua 20 voit taas muuttaa mieleisesi mukaan.
ONGELMA 2 ~ LÄPINÄKYVÄT KULMAT
Tähän ongelmaan olet saattanut törmätä, mikäli et käytä valkopohjaista Simplen mallia. En ole testannut, näkyykö ongelma muissakin kuin Simplen väripohjaisissa malleissa, mutta niissä tämä ongelma ainakin ilmenee, jos olet käyttänyt pyöristyskoodia. Vaikka valkea blogipohja onkin pyöristynyt, se on jättänyt jälkeensä haaleat, vähän läpinäkyvää muistuttavat kulmat. Ikävää, eikö?
Miten korjata ongelma?
- Malli -> mukauta -> lisäasetukset -> lisää alla oleva koodi CSS:ään:
.content-outer{
box-shadow: none;
}
.content-outer{
box-shadow: none;
}
ONGELMA 3 - VALKOISET, PIENEMMÄT KULMAT, JONKA SYYNÄ EI OLE BANNERI
On siis kyse ongelmasta, johon ei banneri vaikuta. Ainakin oikeaan kulmaan on jäänyt valkoinen, esiin puskeva kulma, jota ei saa banneria mihinkään suuntaan siirtämälläkään pois. Tämä ongelma ei tietojeni mukaan automaattisesti esiinny ainakaan Simplen valkopohjaisessa mallissa, mutta esimerkiksi sinipohjaisessa Simplessä kyllä.
Miten ratkaista ongelma?
- Hallintapaneeli -> Malli -> Mukauta (eli menet mallin suunnittelutyökaluun) -> Lisäasetukset -> Taustat -> Ylätunnisteen tausta -> Muokkaat sen läpinäkyväksi
Toivottavasti tästä oli apua! Lisäilen tänne ongelmia sitämukaa, jos niitä teille tulee. :-)
Tunnisteet:
banneri,
blogin kulmat,
CSS,
editointiohjelmat,
koodi,
pyöristäminen,
välit





