personlig meny

Datum:2013-02-15 / Tid:07:26:00 / Kategori:Tips - Bloggdesign
Har fått frågor om hur jag delar in mina kategorier under tillexempel nicole, fotografi, resor, annat osv. Har visat förut men eftersom jag har många nya läsare gör jag en ny. Det kan se svårt ut, men egentligen är det ganska lätt.

- ta bort det här från din kodmall.

- när du tagit bort det klistrar du in dethär på samma ställe:
 

<div class="navheader">Rubrik 1</div>
<ul>
<li><a href="Länk till kategorisida">Namn på kategorin</a></li>
<li><a href="Länk till kategorisida">Namn på kategorin</a></li>
<li><a href="Länk till kategorisida">Namn på kategorin</a></li>
</ul>

 

<div class="navheader">Rubrik 2</div>
<ul>
<li><a href="Länk till kategorisida">Namn på kategorin</a></li>
<li><a href="Länk till kategorisida">Namn på kategorin</a></li>
<li><a href="Länk till kategorisida">Namn på kategorin</a></li>
</ul>

 

- när du klistrat in det är det dags att ändra lite. Där det står "rubrik 1" ska du skriva underrubriken. (som tillexempel foto, vardag osv) Där det står "länk till kategorisida" ska du klistra in sidans länk. (tillexempel twinstars.blogg.se/category/vardag) Där det står "namn på kategorin" ska du namnge kategorin. (tillexempel under underrubriken foto: natur, vatten eller porträtt)

 

- om du vill ha fler underrubriker så klistrar du in det flera gånger och ändrar länkarna osv. Kom ihåg att alltid skriva "</ul>" efteråt.

 

hoppas ni förstod, kram nicole.


gör en egen ikon / gimp 2.6

Datum:2012-11-12 / Tid:14:03:52 / Kategori:Tips - Bloggdesign
 
I den här videon visar jag hur ni kan göra era alldeles egna bloglovinikoner. Hoppas att det är till er hjälp! Screenfilmaren ville tydligen inte stänga av sig i slutet så jag måste typ ha massa eftertexter osv. Men hoppas att ni gillar det ändå!

tips galleriet

Datum:2012-11-11 / Tid:20:12:00 / Kategori:Tips - Bloggdesign
Här hittar ni alla tips jag gjort inom foto, design, redigering och lite annat också. Här kommer också att visas kommande tips och ni kan komma med egna önskemål om vad jag ska tipsa om. Hoppas att det är till er hjälp!

- tre korta fototips
- produktfoto
- tips för bra porträttbilder
kamerans inställningar
- hur bländaren fungerar
- hur slutartiden fungerar
- hur vitbalansen fungerar
kommande:
Hur fungerar ISO?
 

- runda hörn + skugga bakom texten
- vanlig redigering till naturbilder
- regnbågstext + skugga
- transparent cirkel med text i
- genomskinlig ram i din bild
- skugga bakom bild
- triangel i din bild
- röd ton i en bild
- redigering till höstbilder
- taveleffekt/ränder i din bild
- vinjettering
kommande:
hur gör jag en bild svartvit?
hur man redigerar ögonen i porträttbilder.
 
- rullande text i menyn
- personlig meny
- sätt in din header + byt bakgrundsfärg
- bild i menyn
- ändra bredden på din blogg
- egen ikon i adressfältet
- bild ljusare vid mouseover
- hur man gör egna ikoner
kommande:
hur man gör egna ikoner


 HUR LÄSER JAG LISTAN?
allt som är med vanlig stil: de tipsen finns redan på bloggen, bara att söka i rätt kategori.
allt som är med sned text: det kommer att komma upp på bloggen inom snar framtid.

Vad vill ni lära er om bloggdesign, foto, redigering osv?

Datum:2012-09-27 / Tid:14:25:48 / Kategori:Allmänt
 
Har tänkt börja göra en lista på tipsinlägg som kommer att komma upp om t.ex. foto, redigering och bloggdesign. Så skriv här i det här inlägget vad ni vill lära er! Ska försöka visa allt, i med instruktioner i antingen video eller bilder. Så fråga på!

Bloggdesign - ljusare bild vid mouseover

Datum:2012-05-15 / Tid:15:22:40 / Kategori:Tips - Bloggdesign
Hej på er alla! :D Jag fick en fråga om hur man gör så att bilden blir ljusare när man rör musen över bilden. Det är egentligen väldigt enkelt, följ bara instruktionerna!

1. Gå till din kodmall och klistra in denna kod mellan <head> och </head>.

<style type="text/css">
img{opacity: 1;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;}

img:hover{opacity: 0.6;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;}
</style>


2.
Sedan sparar du din kodmall! Kommentera om något inte gick som det skulle.

Bloggdesign - egen ikon i adressfältet

Datum:2012-04-23 / Tid:19:43:08 / Kategori:Tips - Bloggdesign

Hej på er! :) Nu så tänkte jag göra ett bloggdesigntips (länge sedan, jag vet) på hur man fixar en egen ikon i adressfältet högst upp, som bilden visar då. Lätt som en plätt!
1. Börja med att kopiera bildkoden till bilden du valt att ha i ditt adressfält. (sök på google bilder på t.ex. kameraikon, hjärta eller vad du nu vill ha) Bildkoden är koden som finns i adressfältet när bilden är i en egen flik.


2. Klistra sedan in den här ↓ koden under <head> i din kodmall. Klistra in bildkoden där det står att du ska göra det.
<link rel="Shortcut Icon" href=" BILDKODEN " />

KLART! Spara sedan. Om något gick på tok, kommentera inlägget då!

Bloggdesign - bredare blogg.

Datum:2012-02-28 / Tid:17:20:26 / Kategori:Tips - Bloggdesign
Hejsan på er! <3 Jag fick en fråga om hur man gör sin blogg bredare, så jag tänkte visa det. Det är egentligen ganska enkelt. Du använder bara stilmallen.


1. Gå till din stilmall, och bläddra ner till stycket "#wrapper {"
2. Där det står "width" ska du utöka talet med cirka 100-200, det beror på hur bred du vill ha bloggen. Förhansgranska sedan!
3. Om du tycker att det är bra så sparar du.
OBS! Om något inte gick som det skulle, kommentera inlägget då!


Bloggdesign - Bild i menyn

Datum:2012-02-25 / Tid:18:10:46 / Kategori:Tips - Bloggdesign
Hejhejhej! :D Jag fick en fråga om hur man fixar in bilder i menyn. So let's start. Det är egentligen väldigt enkelt, bara man placerar in koden på rätt ställe. Man använder sig av kodmallen.



1. Gå först till "Skapa bild" och sedan "bläddra". Så väljer du bilden du ska ha, och klickar på "ladda upp bild". Sedan klickar du på miniatyren och då kommer du till en sida där din bild visas i helskärm. Då kopierar du adressfältet. (Bildkoden)



2. Sedan går du till din kodmall. Sedan klistrar du in följande kod där bilden visar;

<img src="bildadressen här">

Där det står "bildadressen här" klistrar du in bildkoden som du kopierade från adressfältet.


Vad vill ni lära er inom bloggdesign?

Datum:2012-02-12 / Tid:16:52:28 / Kategori:Tips - Bloggdesign



Bloggdesign - grunder.

Datum:2012-02-12 / Tid:16:40:44 / Kategori:Tips - Bloggdesign
Hejhejhej! <3 :) Nu ska jag visa några bloggdesigngrunder som många av er säkert kan, men för nybörjare kan det vara bra. Jag ska visa hur du lägger in din header och hur du ändrar bakgrundsfärg på bloggen.


1. Börja med att klicka på "skapa", sedan på "bild", och så klickar du på "bläddra".



2. Sedan väljer du bilden du vill ha och klickar på öppna. Sedan ställer du in bredden på bilden. Jag brukar själv alltid välja 1000. Sedan klickar du på ladda upp bild.



3. Sedan kommer du till en sida där rubriken heter "Redigera bild". Där klickar du på din bild som är en miniatyr. Sedan visas din bild i fullskärm. Då kopierar du adressfältet. (Det är bildadressen)


4. Sedan går du till stilmallen. Bläddra ner till stycket "#header {". Mellan parenteserna klistrar du in bildadressen. Om bilden inte passar så ändrar du bredd och höjd. Förhandsgranska först, och så sparar du.





1. Börja med att gå till en färgkarta. KLICKA HÄR! Sedan väljer du färgen du vill ha och kopierar färgkoden.



2. Sedan går du till din stilmall. Överst i stilmallen hittar du stycket "body {". Klistra in din färgkod som bilden visar. Sedan förhandsgranskar du, och sedan sparar du.


Bloggdesign - Personlig meny.

Datum:2012-02-09 / Tid:20:26:31 / Kategori:Tips - Bloggdesign
Hej på er! <3 Nu tänkte jag visa hur man gör en personlig meny. Titta på bilden nedan så ni förstår vad jag menar! ↓


1. Börja med att gå till din kodmall, och ta bort detta:

2. Istället för koden du tog bort så klistar du in denna:

<div class="navheader">Rubrik 1</div>
<ul>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
</ul>

<div class="navheader">Rubrik 2</div>
<ul>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
</ul>


3. Hur du ska ändra:

"Rubrik 1" = Här ska det stå underrubriken. (T.ex. foto)
"Namn" = Här ska det stå kategorins namn. (T.ex. foto → natur)
"Länk till kategorisida" = Länk till kategorisidan.
(Bilden där nere visar hur du kommer till kategorisidan) ↓


4. Spara sedan kodmallen och gör likadant i alla kodmallarna! (Arkivsida, kategorisida, inläggsida)

- Om du vill ha fler underrubriker så ska du göra såhär:

<div>Rubrik 1</div>
<ul>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
</ul>

<div>Rubrik 2</div>
<ul>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
</ul>

<div>Rubrik 3</div>
<ul>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
<li><a href="Länk till kategorisida">Namn</a></li>
</ul>


KLART! Det är väldigt svårt att förklara, så säg om ni inte förstod! Då kan jag förklara pånytt åt er skilt! :)

Bloggdesign - Rullande text i menyn.

Datum:2012-01-22 / Tid:13:17:47 / Kategori:Tips - Bloggdesign


Klistra in denna kod i kodmallen, någonstans under <div id="side">.


<style type="text/css">
.marquee {
height:15px;
width:200px;
background-color:ffffff;
font-family:tahoma;
font-size:11px;
color:666666;
}
</style>
<marquee direction="left" behavior="scroll" scrollamount="3" >TEXTEN HÄR!</marquee>


Sedan skriver man det man vill att det ska stå istället för "TEXTEN HÄR". Spara sedan kodmall, och gör likadant i de andra kodmallarna. Hoppas att ni förstod!
@Nicole