Topplistan
Webbdesign
Detaljer för "BLOGGSTYLE"
BLOGGSTYLE![]() BLOGGSTYLE Blogghjälp för dej som har svårt för koder, finns färdig bloggdesign och tävlingar! Artiklar
TÄVLING - BLI VECKANS BLOGG
2011-09-19 18:56:00 1. Skriv att du är med i detta inlägget2. Lägg till sidan på bloglovin 3. Ett plus om du gillar sidan på FacebookKlart! Vinnaren dras den 25 Sep VILL DU HA FLER BESÖKARE KLICKA HÄR Mer om: Tävlingar
TÄVLING - BLI DAGENS BLOGG!
2011-09-19 18:44:00 SKRIV ATT DU ÄR MED I DETTA INLÄGGET, DRAR FYRA VINNARE PÅ ONSDAG Mer om: Tävlingar
Flytta texten mer åt höger i meny
2011-09-17 11:16:00 Vissa har kanske fått till texten så här i sin meny, exempel:1. För att rätta till detta gå in i stilmallen och bläddra ner till div#side 2. För att göra det lättare ta bort denna koden: padding: 0 20px 0 0; .......................................................3. Skriv in denna koden, se bild nedan:Förklaring:padding-right = Hur långt texten ska flyttas inn från högerpadding-left= Hur långt texten ska flyttas inn från vänsterpadding-top= Hur långt avstånd texten ska ha från uppifrånpadding-top= Hur långt avstånd texten ska ha från bottenÖka 7px; till högra siffra om du vill ha större mellanrum mellan text och meny kant, eller minska ner.
Skapa kategorier och länkar..
2011-09-16 20:12:00 Jag förklarar hur man skriver inlägg, skapar olika kategorier och länkar:1. Klicka på kategorier och skapa ny kategori2. Fyll i en kategori tex Foton och lägg till. 3. Klicka nu ett inlägg genom att klicka på skapa och inlägg, se bild nedanSpara sedan inlägget i den kategori som du har skapat och spara så ska det vara klart, svårare änn så är det inte. Nu ska jag visa hur du lägger in och tar bort länkar på din bloggSå här ser det ut just nu på din nya blogg, se länkar:1. Ta bort länkar, gå in på arkiv och länkar.Marke dem som du vill ta bort och klicka ta bort markerade. 2. Lägg till en länk genom att klicka på skapa och länk, se exempel nedan:Vill ni veta mer om hur något funkar så lägger jag upp det här.
Statistikräknare med flag counter
2011-09-16 16:10:00 Vill du ha en liten mer rolig statistiksräknare där du kan se om någon har besökt din blogg från annat land men även sverige såklart visas så kan du lätt skaffa det med Flag counter, gå in på denna [Länk]Nu finns det lite olika saker man kan göra:- Ändra färg på bakgrund, text och ram- Välj hur många flaggor som ska synnas När du är klar klickar du på Get your flag counter, kopiera koden i rutan högst upp.Klistra in koden i din kodmall, bläddra ner till <div id="side"> Klistra in koden innan:<div> <a href="index.rss" title="RSS"><img src="http://static.blogg.se/img/rss.gif" border="0" alt="RSS 2.0" /></a> </div>Vill du ha den i mitten (centrerad)Skriver du precis innan koden <center> och efter koden </center>Spara och se hur det blev.
Lägg in statistikräknare på din blogg
2011-09-16 14:09:00 1. Logga in på http://www.susnet.se/ 2. Registrera dej 3. När du loggat in klickar du på statistikmätaren 4. Klicka på ny statistikmätare och sedan på räknarkoder5. Kopiera koder och klistra in i kodmallen, Klistra in koden på raden innan </head>6.Klistra in det som står nedan i kodmallen där du vill ha din räknare, nånstans nedanför <body> <table><tr><td colspan="2"><b>Mina besökare</b></td></tr><tr><td>Totalt:</td><td>Klistra in koden från susnet här</td></tr><tr><td>Denna månad:</td><td>Koden från susnet här</td></tr><tr><td>Denna vecka:</td><td>Koden från susnet här</td></tr><tr><td>Idag:</td><td>Koden från susnet här</td></tr><tr><td>Online nu:</td><td>Koden från susnet här</td></tr></table> 7. Kopiera tex: antal besökare denna v...
Lägg in bloglovin ikon på din blogg
2011-09-16 12:08:00 1. Logga in på ditt konto på bloglovin 2. Klicka på konto och knappar/ikoner3. Välj den ikon du vill ha, "skaffa den här ikonen" och kopiera koden som dök upp.4. Gå in i din kodmall och bläddra ner till <div id="side"> och lägg koden direkt efter. Spara så ska det vara klart!
Klocka på bloggen
2011-09-16 10:07:00 Det är mycket lätt att lägga upp en klocka på sin blogg, klicka in på denna sidan: [Länk]Där finns det flera olika varianter man kan välja bland.Klicka på View html tag och accept Nu ska du välja vilken färg du vill ha, storlek och ställa in rätt tidTex GTM +18 Kopiera den översta koden och klistra in den i kodmallen någonstans mellan <div id="side"> </div>Spara och se hur det blev, funka inte första koden prova den andra.Fler tips på sidor:- timeanddate.com- worldtimeserver.com- respectsoft.com- mlsisland.com
Ta bort texten i headern
2011-09-15 21:01:00 1. Gå in i din kodmall och ta bort denna koden som är markerat:2. Gör nu samma sak på de andra sidorna:inläggssidakategorisidaarkivsida
Ta bort "om" i menyn
2011-09-15 18:40:00 Vill du ta bort länken Om i menyn ska du ta bort koden:<h4> Om </h4> i din kodmall.Är någonstans under koden <div id="side">För att ta bort profilbilden och namn ta bort denna koden:<div id="profile"> <tag:profile> <tag:if test="${ProfileExists == 'true'}"> <h4>Om</h4> <a href="${AppUrl}index.bd?fa=pf.view&pf_id=${ProfileID}"><img class="thumbnail" src="${AppUrl}shared/img/profiles/${ProfileImage}" alt="Min profilbild" /></a> <p><a href="${AppUrl}index.bd?fa=pf.view&pf_id=${ProfileID}"><span style="font-weight:bold"> ${ProfileName}</span></a></p> </tag:if> </tag:profile> När du ändrar i kodmallen ska du ändra på alla sidor. Detta är viktigt annars ändras det bara på den sidan du sparat. Även viktigt att spara innan du byter till nästa del.
Få en ikon i din browser
2011-09-15 13:56:00 Först hittar du en bild du gillar i rätt format 16x16px tex Du hittar fler på min sida [Länk]1. Ladda upp bilden på din blogg, klicka på bilden och kopiera länken till bildenKlistra in länken i denna koden:<link rel="shortcut icon" href=" din länk ">2. Gå nu in i din kodmall och klistra in koden under <head>Gör nu detta på alla sidor och spara så ska det vara klart, nu vet jag att detta funkar i firefox men inte i internet explorer för vissa.
Ändra storlek på rubrikerna i menyn
2011-09-15 11:55:00 Om man vill ändra storleken på rubrikerna i menyn gör man detta i stilmallenBläddra ner till denna koden, se bild nedanÄndra storleken där det står font-size:16px;Förhandsgranska och spara när du är nöjd.
Ändra färg på rubrikerna i menyn
2011-09-15 09:54:00 Ändra färg på rubrikerna i menyn gör du detta i stilmallenBläddra ner till denna koden och ändra där det står color:
Scroller i inläggs rutan
2011-09-15 08:53:00 1. Gå in i stilmallen och scrolla längst ner och klistra in denna koden:#scrollbox {width:550px;height: 500px;overflow: auto;}Ändra bredd och höjd på width=bredden och höjden=height2. Gå in i kodmallen och bläddra ner till <div id="content"> Klistra in denna koden <div id="scrollbox">Så här ska det se ut:<div id="content"><div id="scrollbox">3. Lägg till </div> i slutet av content 4. Om det inte händer något nu när du har sparat beror det på inställningarna stilmallen.Ändra width i content bredare änn width i koden längst ner i stilmallen, som du la in.
Fallande hjärtan etc på din blogg
2011-09-14 20:14:00 Har ett färdiga script, fallande snö, men som man kan byta ut till hjärtan etc. Ska förklara hur ni klistrar in koden men även hur ni ändrar hastighet, antal symboler som syns och färg.1. Kopiera denna koden:<script type="text/javascript">Width =1000; // ange bredden på sidan som ska snöas in...Height =2000; // ange höjden på sidan som ska snöas in...Count =25; // antal snöflingor OBS! ange inte för stort antal!MaxStep=3; // max steg i rörelsenMinStep=1; // min steg i rörelsenMaxFlake=10; // max storlek på snöflingaMinFlake=4; // min storlek på snöflingaPosX = new Array();PosY = new Array();StepX = new Array();StepY = new Array();StarSize=new Array();for (i = 0; i < Count; i++) {PosX[i] = Math.random()*Width;PosY[i] = Math.random()*Height; StepX[i] =MinStep+Math.random()* -MaxStep;StepY[i] =MinStep+Math.random()* MaxStep;StarSize[i]=MinFlake+Math.random() * MaxFlake;document.write("<div id='Obj" + i + "' style='position:absolute; left:0px; top:-20px; z-index:10000; ...
TÄVLING - BLI DAGENS BLOGG
2011-09-14 18:52:00 DRAR FYRA VINNARE NÄSTA KVÄLL! ALLA KAN VARA MED, BARA ATT SKRIVA UPP SEJ Mer om: Tävlingar
Hur man laddar upp bild i inlägg
2011-09-14 18:51:00 Att ladda upp en bild i ett inlägg är mycket lätt. 1. Börja med att kolla hur bred rutan är som ni lägger in alla era inlägg, (content)Gå in i stilmallen och bläddra ner till denna koden:Står det så här får inte bilden du laddar upp vara mer änn 650px bred2. Klicka nu på skapa och nytt inlägg, klicka sedan på det som visas på bilden nedan.3. Klicka på ladda upp din bild och välj sedan hur bred bilden ska vara, du vet nu vad den max får vara men klicka även på din bild och se hur bred den är i px är den tex: 243px ska du ställa in på 300px när du laddar upp.Hoppas detta har hjälp er något.
Bakgrund i menyn
2011-09-14 18:50:00 1. Skapa först en bild eller ta en från nätet.2. För du ska få bakgrunden som du vill gå in i photoshop.Kolla hur bred menyn är i px och skapa en lika bred fil i photoshop, höjden bestämmer du själv efter hur du vill ha det.3. Ladda upp bilden i bloggen och kopiera länken (se bild)4. Gå in i stilmallen Bläddra ner till denna koden:#side {position: absolute;left: 744px;top: 196px;width: 202px;display: inline;padding: 0 5px 5px 5px;background: #ffffff; <-----Ändra härborder-left-width: 1px;border-left-style: dashed;border-left-color: #dad9d9;}Så här ska det se ut på raden du ska ändra:background:url(länk) repeat;Exempel:background:url(http://bloggstyle.se/images/2010/bakgrund_68188569.jpg) repeat;Vill du inte att bilden repeterar neråt ska det stå no-repeatDå var det klart :)
Flytta upp datum
2011-09-14 18:49:00 För att få datumet högst upp (se bild)Gör då så här:1. Gå in i kodmallen och bläddra ner till content, leta upp koden som ser ut så här:<h3>${EntryTitle}</h3><div>${EntryBody}</div><div>${EntryDate} @ ${EntryTime}2. Ta bort koden som ser ut så här:${EntryDate} @ ${EntryTime}3. Koppiera sedan denna koden:<div align="right"><font face="verdana" size="1" color="red"> ${EntryDate} @ ${EntryTime}</font></div>4. Klistra in den här (se bild) under <h3>${EntryTitle}</h3>Du ändrar om du vill ha den till höger=right vänster=left mitten=center Typsnitt ändrar du på font face="verdana" Storlek på size="1" Färg på texten: color="#E0E0E0" Färgkarta
Tävling - Bli dagens blogg !
2011-09-12 20:16:00 DRAR FYRA VINNARE TISDAG KVÄLL! ALLA KAN VARA MED, BARA ATT SKRIVA UPP SEJ Mer om: Tävlingar
BLI VECKANS BLOGG AVSLUTAS IKVÄLL!
2011-09-12 17:33:00 KLICKA PÅ BILDEN FÖR ATT KOMMA TILL TÄVLINGEN FÅ CHANSEN ATT SYNAS FÖR CA 400 BESÖKARE/DAG!
Ändra utseende på kommentars rutan
2011-09-12 10:21:00 1 Börja med att klicka på kodmallen, bläddra ner till content2 Ändra så det ser ut som på bilden nedan:Koderna man ska klistra in:<div><div align="right"><div>3 Spara och klicka sedan på stilmallen4 Lägg till dessa koder: .entrymeta1 a {color:#333333;padding:10px;text-decoration:none;background:#cccccc;} .entrymeta1 a:hover {background-color:transparent;color:#333333;padding:10px;text-decoration:none;background:#cccccc;}5 Lägg till dem efter .entrymeta a {...Om man vill lägga in en egen bild istället för bara en färg som bakgrund lägger man till denna koden:background:url(LÄNK FRÅN BILD HÄR);Andra koden som det står .entrymeta1 a:hover { är den koden som ändrar hur det ser ut vid mouseover6 Förhansgranska och spara
Videofy.me - Lägg in alla dina filmer i menyn
2011-09-12 08:19:00 Videofy.me vet nog de flesta om, men för ni som inte vet är det en sida där man laddar upp sina egna filmer och delar med sej av och visar för andra, man kan kopiera en kod och lägga in i ett inlägg så filmen syns på sin blogg.För att veta mer videofy.me Nu tänkte jag visa en sak som inte var så lätt att hitta på videofy.me sidan, hur man lägger upp alla sina filmer i menyn, se exemplet nedan: 1. För att göra detta kopiera denna koden:<iframe style="display:block" width="150" height="450" frameborder="0" scrolling="no" src=http://widget.videofy.me/w/videolist/b/bloggid></iframe>2. Där det står bloggid byter du ut till din egna videofy.me adress, i mitt fall bloggstyle3. Kopiera sedan koden och lägg in i kodmallen, efter denna kod: <div id="side">4. Nu ska du bestämma hur bred och hög den ska vara, detta göra man på: width="150" height="450"Spara!
BLI DAGENS BLOGG 10 ST VINNER
2011-09-11 23:36:00 VILL DU BLI DAGENS BLOGG, LÄGG FÖRST TILL SIDAN PÅ BLOGLOVIN <---Klicka SKRIV ATT DU ÄR MED, KLART! Mer om: Tävlingar
Vad är vad i stilmallen
2011-09-11 23:15:00 Body - Bakgrund. Wrapper - Det vita, i tex. design mallen "Fashion".Header - Bilden längst upp. Oftast med flera bilder och ett namn eller text Side - Side, alltså menyn.Content - Själva inläggen.(rubrik+inlägg). Du kan ändra på bredden där. Entry headers - Inläggens rubrik.Navheader - Menyns "header". Alltså rubrikernaNav - Det under rubrikerna i menyn, "innehåll". Nav ul - Tillexempel, egna flikar i menyn som kanske inte är såna där Arkiv, kategori osv. Saker som te x "Om mig, bloggsvar," osv. Alltså eget = ULNav li - Flikar i menyn som har länkar, som inte är UL eller NAV. Tillexempel, "Tillbaka till bloggens startsida". Post's body text - Inläggen. Man ändrar tillexempel skrivstil där Posted by txt - "kommentarer, Allmänt, Kommentera här" Såna under inlägget. Commentheader - Header på kommentarer. "postat av *namn*" Commenttext - Kommentarer, texten. Commentmeta - "Skrivet *datum och klocka* URL" Commentform - Där du kommenterar ett inlägg Länkar: .entrymeta a { color: #...
Koppla ihop dina inlägg med facebook, twitter...
2011-09-11 22:19:00 Jag kollade upp hur man lättast kan koppla ihop facebook och även andra sidor som tex twitter, med sin blogg. Alltså så fort man skriver något inlägg på sin blogg, dyker även detta upp på sin facebook logg! 1. Skapa ett konto på http://twitterfeed.comGå efter vad som står och det är klart inom någon minut!
Veckans blogg tävlingen avslutas snart!
2011-09-11 22:15:00 KLICKA PÅ BILDEN FÖR ATT KOMMA TILL TÄVLINGEN FÅ CHANSEN ATT SYNAS FÖR CA 400 BESÖKARE/DAG!
Missa inte tävlingen att bli veckans blogg!
2011-09-11 19:53:00 KLICKA PÅ BILDEN FÖR ATT KOMMA TILL TÄVLINGEN FÅ CHANSEN ATT SYNAS FÖR CA 400 BESÖKARE/DAG!
Sära på header och wrapper
2011-09-11 18:51:00 Jag fick en fråga av Fanny:Hej! :) Jag undrar om man kan positionera wrappen så att den hamnar nedanför headern?Tacksam för hjälp! :)Exempel nedan:1. För att ändra detta klicka på kodmallen2. Flytta wrapper, se förklaring nedan:3. Nu för att flytta headern så den hamnar rätt gör man detta i stilmallenÄndra i denna koden: div#header {float: left;margin-top: 40px;padding: 0 0 40px 20px;width: 760px;background: #000000;}Ändra margin-top:??px; för att flytta upp eller ner headernLägg till margin-left eller right, exempel margin-left:100px; eller margin-left:-100px;Förhandsgranska och spara!
Linje runt bloggen (wrapper)
Mer artiklar från denna bloggen:2011-09-11 11:49:00 1. Klicka på stilmallen3. Kopiera denna koden: border:2px dotted #950C22;4. Leta upp denna koden:#wrapper {margin:0px auto;background-color:#fff;width:80%;padding:10px;border:2px dotted #950C22; <-------Lägg till koden här} Ändra färg på: #950C22Ändra utseende på linjen: dottedÄndra tjockleken på linjen: 2px Olika typer av linjer som ni byter ut i koden:dottedsoliddoubledashed 1-30, 31-60, 61-90, 91-120, 121-150 |





