keskiviikko 26. syyskuuta 2012

Facebook -kuvakkeen lisäysohje


1. Kirjaudu Bloggeriin
2. Klikkaa vasemmalta "Ulkoasu"
3. Klikkaa laatikkoa "Lisää gadget"
4. Etsi sellainen gadget, jossa lukee otsikko "HTML/JavaScript"
5. Jätä otsikkokenttä tyhjäksi ellet halua laittaa siihen jotain tekstiä esim. "XXXXX Facebookissa" tjs.
6. Kopioi Sisältö -kenttään koodi, jonka muokkaamisen esittelen alempana
(7. Raahaa gadgetti haluaamaasi paikkaan sivustolla)
8. Tallenna

KOODIN MUOKKAAMINEN (tässä ei esitellä kaikkea seikkaperäisesti vaan ainoastaan niiltä osin kuin yleensä tarvetta)

KOODI JOTA LÄHDETÄÄN MUOKKAAMAAN
<a href="FACEBOOK-SIVUN OSOITE" target="_blank" title="JOKIN TEKSTI, ESIM. BlogiHelppi Facebookissa"><img border="0" alt="" width="32" height="32" src="KUVAN OSOITE" /></a>

VAIHEET:
1. href="" => hipsujen sisään laitetaan sen sivuston nimi, jonne sydäntä klikkaamalla pääsee esim. Facebook-sivun nimi
2. target="_blank" => tarkoittaa sitä, että sivusto aukeaa omaan välilehteen kun sydäntä klikkaa. Itse tykkään käyttää tätä vaihtoehtoa. Tämän voi poistaa, jos sivu saa aueta samaan välilehteen.
3. title="" => hipsujen sisään laitetaan se teksti, joka näkyy vihjetekstissä/tooltipissä kun kuljetat hiiren kuvakkeen päälle. Tämän voi poistaa jos ei halua mitään tekstiä
4. border (reunus) kannattaa yleensä antaa olla nollana
5. alt="" vaihtoehtoinen teksti, joka näkyy, jos esim. kuvaa ei saada ladattua kuvapalvelusta. Itse en käytä yleensä, koska lataan kuvat omaan kuvapalveluun. Joskus, jos linkattu vieraalle sivulle ja kuva esim. poistetaan sieltä => se ei enää näy sinunkaan sivulla.
6. width="32" height="32" => näillä määritellään kuvan koko "leveys ja korkeus, pikseliä". Yleensä suositellaan, että kuvan koko kannattaa kertoa tässä koodissa JA kuva pitäisi olla vieläpä oikeastikin samaa kokoa kuin nuo luvut on (ts. jos kuva on oikeasti 32*32, pitää siitä huolimatta mainita tuo width="32" height="32" koska se parantaa sivun suorituskykyä). Kokeilemalla löytää yleensä oikean koon, laittamalla hipsuihin pienempiä/suurempia arvoja. Nyrkkisääntö, että vain pienentäminen kannattaa, koska kuvan laatu heikkenee suurennettaessa.
7. src="" hipsujen sisään tulee se osoite, josta kuva ladataan. Yleensä kannattaa kuvat ladata esim. Picasa-palveluun, mutta tässä voi käyttää esim. mistä tahansa netistä löytyvää kuvaa. Sitä voi sitten tuolla kokoasetuksella säätää sopivaksi. (HUOM! Hyvien tapojen vastaista, ks. eteenpäin)

Facebook-kuvakkeita voi tehdä myös itse, mutta netti on pullollaan myös ilmaisia kuvakkeita. Yleensä toivotaan linkkausta tuonne sivustoon, josta kuva ladataan. Kuvakkeita voi kokeilla hakea esim. hakusanoilla "free facebook icon" tjs ja kannattaa hakea kuvakkeita tai pienempiä kuvia kuin 256*256 (yleensä riittää valtaosalle käyttäjistä), jotta niiden lataamiseen ei mene niin kauaa aikaa (suorituskyky heikkenee sivulla) eikä mitään "vippaskonstipienentämisiä" tarvitse ruveta tekemään. Kun haluamasi kuva löytyy, niin hiiren oikealla valitaan vaihtoehto "Kopioi kuvan URL-osoite" (eri selaimissa eri tekstejä!) => osoite vaan src-hipsujen sisään ja laittelee koon oikeaksi. Huomioi, että kuva pitää aina aukaista eikä kopioida osoitetta googlen kuvahaun tuloksista!

MINUN SIVULLENI LISÄÄMÄ KOODI ON TÄSSÄ:


<a href="http://blogihelppi.blogspot.fi/p/blogihelppi-ei-ole-viela-facebookissa.html" target="_blank" title="BlogiHelppi ei ole vielä Facebookissa"><img border="0" alt="" width="64" height="64" src="http://www.veteran.uci.edu/images/facebookicon.png" /></a>


 (BlogiHelppihän ei ole siis vielä Facebookissa) =)

perjantai 24. elokuuta 2012

Kuvien ja sisällön kopioinnin vaikeuttaminen sekä hiiren oikean disablointi


Anni tiedusteli, että miten estetään kuvien kopioiminen. Kuvien (tai ylipäänsä sisällön) kopiointi estetään oikeasti niin, että ei laiteta niitä ollenkaan internettiin, mutta kerron tässä yhden tavan, jolla sitä voidaan ainakin vähentää. =)

"Moikka, en tiiä osaatko auttaa mutta kysyn kuitenkin :) Oon nähnyt mielestäni jossain sellasen HTML koodin, että kun sen pistää, blogistani ei voi kopioida kuvia? Kiitos jos osaat auttaa!" 

1. Kirjaudu Bloggeriin
2. Klikkaa blogisi otsikkoa (tekstin '<luku> sivun katselua' yläpuolella)
3. Valitse vasemmalta 'Ulkoasu
4. Valitse ruudulla näkyvistä laatikoista (ei väliä mistä) 'Lisää gadget'
5. Avautuu uusi ikkuna. Selaa, etsi ja valitse 'HTML/Javascript'
6. Otsikko -ruutuun älä laita mitään
7. Sisältö -ruutuun kopioi tästä linkistä löytyvä koodi (sivulla valitse Ctrl+A ja Ctrl+C)
8. Mikäli haluat muuttaa virheilmoitusta, joka tulee kun käyttäjä klikkaa sivullasi hiiren oikeaa, etsi koodista teksti "Function Disabled!" ja muuta siihen haluamasi teksti, esimerkiksi "Sisällön kopioiminen kielletty!" 
9. Valitse Tallenna -painike

Lisäsin koodin myös BlogiHelppiin. Jos haluat testata ominaisuutta, klikkaa hiiren oikeaa sivullani. 

Thanks for http://www.beinggeeks.com/  !! Kiitos sivustolle http://www.beinggeeks.com/ !!

keskiviikko 25. tammikuuta 2012

Tietoja minusta


1. Kirjaudu Bloggeriin
2. Klikkaa blogisi otsikkoa (tekstin '<luku> sivun katselua' yläpuolella)
3. Valitse vasemmalta 'Ulkoasu'


4. 'Tietoja minusta' -gadget on yleensä valmiina. Klikkaa laatikossa olevaa 'Muokkaa valintaa'
5. Täytä tiedot
- Otsikko: otsikko, joka näkyy blogissasi
- Jaa profiili: Valitse, jos sallit profiilisi näkyvän muille käyttäjille Bloggerissa. (Toim. huom. Teksti 'Profiiliasi ei näytetä, ellei se ole jaettu.' ei oikeastaan viittaa valinta-ikkunaan vaan se kertoo, että mikäli tässä ei ole valintaa, ei myöskään profiiliasi näytetä.)
- Tietoja minusta: Valitse, jos haluat näytettävän tässä blogissa 'Nimi' ja/tai 'Kuvaus' kenttiin kirjoittamasi tiedot
- Nimi: Voit kirjoittaa nimeksi haluamasi nimen
- Kuvaus: Voit kertoa itsestäsi
- Sijainti: Valitse, jos haluat näytettävän tässä blogissa 'Kaupunki', 'Alue/osavaltio' ja/tai 'Maa/alue' kenttiin kirjoittamasi tiedot
- Kaupunki: Kirjoita kaupunkisi nimi
- Alue/osavaltio: Kirjoita esim. läänin nimi
- Maa/alue: Valitse maa
6. Valitse lopuksi 'Tallenna'
- 'Poista' painikkeella tiedot ja koko gadget poistetaan.
- 'Peruuta' peruuttaa ikkunalla tehdyt muutokset
7. Raahaa lopuksi tekemäsi gadget haluamallesi paikalle. Lopuksi valitse ' Tallenna asettelu'


Onnea, olet nyt lisännyt blogiisi ja Blogger-profiiliisi esittelyn itsestäsi.


PARI VINKKIÄ:
1) Jos laitat esittelyyn sähköpostiosoitteesi, kannattaa laittaa se esim. näin 'blogihelppi (ät) gmail . com' eli lisää välilyöntejä ja käytä ät-tekstiä. Tämä vähentää spämmiä. Joskus voimme katsoa tehokkaammankin keinon, mutta tässä tällainen alustava. Huom! Sana ät on tehokkaampi kuin at!
2) Mikäli haluat laittaa tekstiisi kappaleita, niin voit käyttää HTML-merkkejä. Kaksi br-merkkiä peräkkäin  tekee uuden kappaleen. Itse myös lihavoin sähköpostin laittamalla sähköpostin eteen b ja loppuun /b. Nämä merkit tulee aina <> sisään! 


Vinkki 2 vielä kuvina:


Tekstillä:

tulee tällaista jälkeä:




perjantai 20. tammikuuta 2012

Kävijälaskurin ja 'Kävijöitä paikalla' lisääminen

1. Kirjaudu Bloggeriin
2. Klikkaa blogisi otsikkoa (Tekstin ' <luku> sivun katselua' yläpuolella)




3. Valitse 'Ulkoasu' vasemmalta





4. Valitse 'Lisää gadget' kohdasta jonne haluat lisätä laskurin, esim. sivupalkki


5. Etsi ja valitse plussasta 'HTML/Javascript' 
6. Kirjoita otsikoksi haluamasi otsikko, esim. 'KÄVIJÄLASKURI xx.yy.20zz ALKAEN / KÄVIJÖITÄ PAIKALLA'
7. Mene osoitteeseen http://www.sitemeter.com/
8. Valitse 'Sign up' (vihreä pallukka Site meter basic -laatikossa)
9. Valitse uudestaan 'Sign up' (Free -versio)
10. Täytä tiedot
Your Site's URL: blogisi osoite
Your Site's Name: blogisi nimi
Codename: kirjoita tähän jokin uniikki koodi (ei välejä eikä erikoismerkkejä). Tämä näkyy kaikille käyttäjille, joten se ei ole salasana!
Your Current Time: Paljonko kello on nyt?
By checking this box I agree to be bound by Sitemeter's Terms of Service Agreement: Valitse tämä
11. Valitse 'Next' (seuraava)
12. Täytä tiedot:
- Email Address: sähköpostiosoitteesi
- Title: tittelisi yleensä 'other' eli suomeksi 'muu'
- Your ZIP or Postal Code: Postinumero
- Country: Maa, valitse Finland
- Can you receive HTML email?: Voitko vastaanottaa HTML-maileja. Valitse 'No' eli suomeksi 'En'
- Gender: Sukupuolesi, Male=mies, Female=nainen
13. Valitse 'Next'



14. Tarkista tiedot. Jos huomaat virheitä, voit palata korjaamaan 'Back' -valinnalla
15. Valitse 'Next'
16. Homma valmis!
17. Kirjaudu sähköpostiisi ja avaa sähköposti otsikolla 'Site Meter for ...'
18. Käyttäjätunnus palveluun löytyy kohdasta 'Your codename is ...'
19. Salasana palveluun löytyy kohdasta 'Your password is ...'
20. Mene uudelleen osoitteeseen www.sitemeter.com. 
21. Olet jo kirjautuneena palveluun, joten mene kohtaan 'Manager'
22. Valitse vasemmalta 'meter style'
23. Valitse kävijälaskurisi tyyli ja 'Select'
24. Täytä tiedot 
- Size: koko
- Digit color: numeroiden väri
- Background color: Transparent= läpinäkyvä/väritön
- Font: numeroiden fontti
- Shrink width: Valitse, jos haluat erityisen kapean
- Commas: Pilkut vai ei
ja valitse 'Save'
25. Valitse vasemmalta 'HTML code'
26. Valitse kaikki ylemmässä ruudussa oleva teksti (Ctrl + A) ja paina Ctrl + C (kopioi)
27. Mene takaisin Bloggeriin ja valitse kohdassa 6. avattu ikkuna
28. Liitä kopioimasi teksti Sisältö -ruutuun
29. Lisää alimmaksi yksi rivi ja lisää teksti <br/> ja paina Enter (toinen rivi)
30. Avaa uusi selainikkuna ja mene osoitteeseen http://www.supercounters.com/
31. Valitse 'Online Counter'
32. Valitse 'Text'


33. Täytä tiedot
- Text color: Valitse tekstin väri ilman risuaitaa # (voit tsekata blogiisi sopivan värin Bloggerin 'Mallin suunnittelutyökalu' -toiminnon kautta)
- Link text: Valitse mitä numeron perässä lukee, esim 'kävijää'
Valitsemalla 'Submit' näet millainen laskurista tulee
34. Klikkaa avautuvaa ruutua, jolloin kaikki tekstit valitaan
35. Paina Ctrl + C (kopioi)
36. Mene Bloggeriin ja valitse kohdassa 6. avattu ikkuna
37. Liitä kopioimasi teksti Sisältö -ruutuun
38. Valitse 'Tallenna'
39. Laskurit on onnistuneesti lisätty blogiisi
40. Lopuksi voit raahata kohdassa 4. lisäämäsi gadgetin haluamaasi paikkaan ja valitse vielä 'Tallenna asettelu'


Hiotaan jossakin vaiheessa laskureita hiukan paremmiksi! Sen verran neuvon kuitenkin, että poista jälkimäisestä koodista sanat </center> ja <center>, niin numerot asettuvat sarakkeen vasempaan reunaan.



sunnuntai 15. tammikuuta 2012

Lukijoita? Blogin ilmoittaminen Blogilistalle..

1. Mene osoitteeseen http://www.blogilista.fi/
2. Valitse 'Luo tunnukset'
3. Täytä kohdat ja valitse 'Rekisteröidy'
4. Valitse 'Lisää blogi'
5. Kirjoita blogisi osoite ja valitse 'Seuraava vaihe'
6. Täytä tiedot puuttuvilta osin 

- Blogin nimi: blogin nimi (yleensä valmiina)
- Blogin WWW-osoite: blogisi osoite (yleensä valmiina)
- Blogin paikkakunta: blogisi paikkakunta
- Avainsanat: kirjoita tähän asioita, joista kirjoitat blogissasi, esim. puutarha
- Kuvaus: lyhyt kuvaus blogistasi
- Blogin syötteen osoite: Syötteen osoite, jota ei tarvitse muuttaa (ainakaan vielä)
- Kirjoittaja: laita ruksi, jos olet blogisi kirjoittaja
7. Valitse 'Ilmoita blogi listaan'. 


Blogisi on nyt ilmoitettu Blogilistaan!


P.s. Käy tsekkaamassa sähköpostisi. Siellä on mailia Blogilistan ylläpitäjiltä.

torstai 12. tammikuuta 2012

Miten uusi Blogger otetaan käyttöön?


1. Kirjaudu Google -tilillesi esim. www.blogger.com
2. Valitse 'Kokeile päivitettyä Blogger-käyttöliittymää.'
3. Homma valmis!

tiistai 10. tammikuuta 2012

Uuden, blogitaustan värisen ylätunnisteen tekeminen ja vaihtaminen

Neuvon tässä yhden tavan tehdä ja lisätä blogiin kuva-otsikko. Käytän apuna PowerPoint- ja MWSnap-ohjelmia.


1. Kirjoita blogisi nimi jollakin haluamallasi fontilla PowerPoint -kalvolle. Käytin itse aluksi kahta tekstilaatikkoa.
2. Halusin otsikon tekstistä saman värisen kuin käyttämäni mallin väliotsikoissa
3. Kirjaudu Bloggeriin ja valitse "Mallin suunnittelutyökalu"
4. Valitse teksti, jonka värin haluat. Väri-koodi näkyy kohdassa 'Tekstin väri'
5. Kopioi tekstin värikoodi, Ctrl + C
6. Avaa Google ja liitä värikoodi hakuikkunaan. Lisää perään sana rgb.
7. Esimerkiksi Color-Hexin sivun kautta löytyy tietoa värikoodin RGB-koodista. Paina RGB-koodi mieleesi.
8. Valitse PowerPointissa kuvake, josta vaihdetaan fontin väri -> More colors (Lisää värejä) ... -> Custom-välilehti (hmm, mikähän tää on suomeksi?) -> laita muistissasi oleva RGB-koodi kohtiin Red-Green-Blue (Punainen-Vihreä-Sininen) ja valitse OK


9. Toista kohdat 3-7, mutta hae värikoodi blogisi taustalta kohdasta 'Taustat' -> 'Päätausta'
10. Paina hiiren oikeaa PPT-kalvon päällä ja valitse 'Format background' (Muokkaa taustaa)

11. Solid fill (Yhtenäinen täyttö?) -> Color (Väri) -> More Colors .. (Lisää värejä) ->  Custom (?) -> lisää RGB-koodit -> Valitse OK
12. Tausta on vaihdettu samanvärikseksi blogisi taustan kanssa
13. Avaa MWSnap (tai jokin vastaava työkalu, jolla voit leikata näytöltä "palasia" ja tallentaa niitä kuviksi)
14. Nappaa kuva PPT-kalvosta
15. Tallenna kuva PNG-muotoon
16. Avaa Picasa osoitteesta http://picasaweb.google.com/
17. Klikkaa kansiota, jossa sinulla on blogisi kuvat
18. Lisää valokuvat joko raahaamalla tai hakemalla ne koneeltasi
19. Valitse OK
20. Valitse juuri lisäämäsi kuva Picasasta
21. Valitse oikealta alhaalta 'Linkitä tähän valokuvaan'
22. Laita valinta 'Vain kuva (ei linkkiä)' päälle
23. Valitse ja kopioi osoite, joka löytyy 'Linkitä kuva' -kentästä
24. Avaa selaimessa uusi välilehti ja siirry Bloggeriin, www.blogger.com
25. Klikkaa 'Ulkoasu'
26. Valitse 'Muokkaa' ylätunniste -laatikosta
27. Laita valinta 'Verkosta. Liitä kuvan URL-osoite alle.'
28. Liitä kohdassa 8. kopioimasi osoite kenttään
29. Valitse valinta 'Otsikon ja kuvauksen tilalla'
30. Valitse 'Tallenna'
31. Valitse seuraavalla sivulla myös 'Tallenna'. Homma valmis!


Jos kuvasta tuli liian pieni, toimi seuraavasti:


1. Toista edellisestä kohdat 1.-5.
2. Valitse koko -valinnalla voit suurentaa kuvaa
3. Kokeile suurentamalla, kopioimalla linkki uudelleen ja liittämällä se sivustoosi


Kannattaa tallentaa tekemäsi PowerPoint -sivu, jotta voit muokata siitä uuden kuvan siinä vaiheessa kun vaihdat esim. blogisi taustaväriä


P.s. itse lisäsin vielä blogitekstien värisen sloganin blogiini kolmannella tekstilaatikolla, johon kirjoitin tekstiä eri fontilla.

perjantai 6. tammikuuta 2012

Google Analyticsin käyttöönotto

Google Analyticsin avulla voit kätevästi seurata sivustosi vierailijoita. Nykyään perusominaisuudet löytyy myös suoraan Bloggerista - tämän avulla voit tutkia tarkemmin vierailijoitasi ja vierailuhistoriaa.



1. Kirjaudu Google-tilillesi, esim. sähköpostiin mail.google.com
2. Avaa uusi välilehti selaimessasi
3. Mene osoitteeseen http://www.google.com/analytics/
4. Valitse 'Sign Up Now'
5. Sähköpostisi näkyy kohdassa Email. Kirjoita sähköpostin salasanasi
6. Valitse 'Sign up'
7. Kirjoita
- Account name: Analytics-tilisi vapaamuotoinen nimi, esim. blogisi nimi
- Website's URL: Blogisi osoite
- Time zone: Aikavyöhyke, valitse 'Finland'
- Sharing settings: Ei muutoksia
- Your country or territory: Valitse 'Finland'
- Laita valintaruksi kohtaan 'Yes, I agree to the above terms and conditions'
8. Valitse 'Create account'
9. Klikkaa ruutua numero 2. Teksti menee siniseksi (valitaan kaikki).
10. Paina Ctrl + C
11. Avaa uusi välilehti ja mene osoitteeseen www.blogger.com
12. Valitse 'Ulkoasu'
13. Valitse 'Muokkaa HTML-koodia'
14. Varmuuskopioi mallisi valitsemalla 'Lataa koko malli'.
15. Paina Ctrl +  F (Etsi sivulta) ja kirjoita hakukenttään /head
16. Laita kursori </head> -sanan eteen ja paina Enteriä (teet uuden rivin)
17. Vie kursori tyhjälle riville
18. Liitä kohdassa 10. leikepöydälle kopioimasi teksti tähän kohtaan
19. Valitse 'Tallenna malli'


Olet nyt liittänyt Google Analytics -seurantakoodin onnistuneesti sivustoosi ja tarkempi kävijäseuranta voi alkaa.