fredag 28 september 2007

Var hittar jag min data jag vill göra backup på? - flyttat

Detta inlägget om backup är flyttat till min nya blogg Tips o Trix.
Upplagd av Inga kommentarer:
Etiketter:

Smidigt och gratis backup-program - flyttat

Detta inlägget om backup är flyttat till min nya blogg Tips o Trix.
Upplagd av Inga kommentarer:
Etiketter:

torsdag 27 september 2007

Lägga till mods i phpBB

Här finns en bra beskrivning på hur man lägger till mods i phpBB:

http://www.phpbb.com/community/viewtopic.php?t=61611
Upplagd av Inga kommentarer:
Etiketter:

phpBB - ett bra och gratis diskussionsforum

phpBB är ett av de mest populära och använda diskussionsforumen. Det är ett s k open source projekt som du kan ladda hem gratis. Det enda som krävs är ett webbhotell med stöd för php och en mysql-databas.

Här hittar du allt om phpBB >>
Upplagd av 2 kommentarer:
Etiketter:

Lägg enkelt till en karta på din hemsida med Google Maps

Google Maps erbjuder gratis kartor till hemsidor. Det finns ett otal antal variationer på kartor och funktioner man kan välja mellan. Jag har valt en enkel karta där adressen pekas ut och med ett informationsfönster där adressen står skriven. Adressen i mitt exempel är till Sveriges Television i Stockholm.

Skapa en html-sida och lägg till följande kod:

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Min karta</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=nyckel" type="text/javascript"></script>
<script type="text/javascript"> function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
var point = new GLatLng(latitud, longitud); //ersätt latitud och longitud med adressens koordinater
map.setCenter(point, 15);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml("Sveriges Television<br>Oxenstiernsgatan 26-34<br>105 10 STOCKHOLM<br>Sweden"); }
} </script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas" style="width: 500px; height: 300px"></div>
</body>
</html>

Nu behöver du ändra lite i koden. Gå först till sidan http://perso.orange.fr/universimmedia/geo/loc.htm för att få de exakta geografiska koordinaterna för adressen du vill ska visas på kartan. Fyll i adressen för att få fram longituden och latituden.

Ersätt i din kod "latitud" och "longitud" med siffrona du fick fram.

Byt ut adressen i koden.

Gå in på http://www.google.com/apis/maps/ och signa upp för Google Maps genom att klicka på "Sign up for a Google Maps API key". Längst ner på sidan skriver du in adressen till din hemsida, klickar i "have read and agree with the terms and conditions" och klickar på "Generate API Key". Nu får du en nyckel som du ska sätta in i din kod: ersätt ordet "nyckel" i koden med din nyckel.

Klart! Nu har du en snygg och funktionell karta på din hemsida!
Upplagd av 14 kommentarer:
Etiketter:

Vänsterställd punklista med bild

Jag fortsätter med min vänsterställda lista och byter ut punkterna mot en bild istället.

ul{
margin: 0;
padding: 0;
margin-left: 17px;
line-height:0;
}
ul li{
line-height:18px;
padding-bottom:8px;
list-style-image:url(image/li.gif);
}

Resultat:



Med detta css visas en bild framför varje list-objekt och varje list-objekt får samma radavstånd (line-height) och ett extra mellanrum efter varje list-objekt.

Stylen är testad och fungerar i IE6+, Firefox 2.0.0.6
Upplagd av Inga kommentarer:
Etiketter:

lördag 15 september 2007

Runda hörn med CSS

En ruta med runda hörn utan en gif- eller png-bild! Är det möjligt?!? Jodå, detta coola trix hittade jag på Webdesignskolans webbplats.
Lite text

Eftersom hörnorna inte blir lika mjuka som när man gör en bild med kantutjämning blir sådana här rutor snyggast i en ljus färg.

CSS:
#container_roundcorners {background: #70A299;}
.roundtop {background: #ffffff;}
.roundbottom {background: #ffffff;}
.roundcorners1{margin: 0 5px; height: 1px; overflow: hidden; background: #70A299;} .roundcorners2{margin: 0 3px; height: 2px; overflow: hidden; background: #70A299;} .roundcorners3{margin: 0 2px; height: 2px; overflow: hidden; background: #70A299;} .roundcorners4{margin: 0 1px; height: 3px; overflow: hidden; background: #70A299;} .content_roundcorners {padding: 0px 10px;}

Kod:
<div id="container_roundcorners">
<div class="roundtop">
<div class="roundcorners1"></div>
<div class="roundcorners2"></div>
<div class="roundcorners3"></div>
<div class="roundcorners4"></div>
<div class="content">
</div>
<div class="roundbottom">
<div class="roundcorners4"></div>
<div class="roundcorners3"></div>
<div class="roundcorners2"></div>
<div class="roundcorners1"></div>
</div>
</div>
Upplagd av Inga kommentarer:
Etiketter:

Vänsterställd punktlista

När man skapar en lista (unorderad list eller ordered list) så lägger texten sig en bit in till höger:
  • li
  • li
  • li
Om man vill ha en rak vänster-marginal i linje med den övriga texten kan man ange detta i sitt stylesheet:

ul{
margin: 0;
padding: 0;
margin-left: 15px;
line-height:0;
}
ul li{
line-height:18px;
padding-bottom:8px;
list-style-type:circle;
}

Resultat:

  • li
  • li
  • li

Med denna stil får varje list-objekt samma radavstånd (line-height) och ett extra mellanrum efter varje list-objekt.

Stylen är testad och fungerar i IE6+, Firefox 2.0.0.6
Upplagd av Inga kommentarer:
Etiketter:

fredag 14 september 2007

Rund ram runt bild i Photoshop

Vill man ha en rund ram runt t ex ett fotografi så fixar man det lätt i Photoshop.

Öppna bilden i Photoshop.

Skapa ett nytt lager.

Välj verktyget "Avrundad rektangel" (U) och ställ in radien på hörnorna. Rita sedan upp rektangeln till önskad storlek i det nya lagret.

Klicka på lagret med rektangeln i lagerpaletten samtidigt som du håller ner Ctrl. Nu markeras rektangeln.

Dölj lagret med rektangeln (men behåll markeringen).

Klicka på lagret med bilden.

Välj i menyn Lager -> Lägg till lagermask -> Visa markering. Tadaaa! Du har fått en snygg ram runt din bild!

Om du vill flytta bilden eller ramen var för sig så klicka bort länksymbolen i lagret. Sedan är det bara att flytta bilden eller ramen genom att klicka på respektive bild i lagerpaletten.

Tillägg: För att lägga till en lagermask kan man också klicka på en symbol som ligger längst ner i lagerpaletten. Se bilden:


Upplagd av 5 kommentarer:
Etiketter: , ,

torsdag 13 september 2007

Sökmotoroptimering = marknadsföring av din hemsida

Sökmotoroptimering är ett viktigt verktyg i varje företags marknadsföringsstrategi. Sökmotoroptimering går ut på att få så höga placeringar som möjligt i sökmotorernas listor vid sökning på för din hemsida relevanta sökord och därigenom driva relevant trafik till din hemsida.

Uppdatera ofta din hemsida
Sökmotorerna lägger märke till hur ofta din hemsida uppdateras och tar hänsyn till detta vid placeringen i sina listor.

Länkstrategi
En välgenomtänkt länkstrategi gör att du syns bättre i sökmotorerna. Det innebär relevanta länkar till och från din hemsida. Sökmotorerna lägger stor vikt vid hur många andra hemsidor i deras index som länkar till din sida. Det är viktigt att dessa länkar är relevanta, d v s hemsidorna som länkar till din hemsida ska ha hög sidrankning, på engelska pagerank, samt ha liknande eller relaterat innehåll. Dessutom ska länkarna innehålla för din sida viktiga nyckelord i länktexten. Utgående länkar ska också vara relevanta; d v s innehålla relevanta nyckelord i länktexten och ta besökaren till sidor med innehåll som relaterar till innehållet på din sida.

Etisk sökmotoroptimering
Sökmotorerna strävar efter att leverera de mest relevanta resultaten åt den som söker, vilket givetvis även gynnar dig, eftersom du då får relevant trafik till din hemsida. Det finns därmed ingen mening att genom oetiska metoder driva trafik till din webbplats. Läs Googles riktlinjer för korrekt och etisk sökmotoroptimering. En seriös sökmotoroptimerare tar avstånd ifrån oetiska optimeringsmetoder som dessutom kan få din hemsida utesluten från sökmotorernas index, metoder som t ex länkfarmar, dolda länkar, annat osynligt innehåll på hemsidan, för hög frekvens av nyckelord, länkning mellan hemsidor som inte har något gemensamt med varandra. Läs mer på Googles hemsida om oetisk sökmotoroptimering.
Upplagd av Inga kommentarer:
Etiketter:

Tre kolumner i samma höjd med hjälp av css

Om man gör en layout med några kolumner bredvid varandra så vill man ibland att kolumnerna ska vara lika höga. Man kan givetvis använda tabeller men ett modernare sätt är m h a css.

Vi skapar tre kolumner av flytande div-taggar i en div-kontainer.

Lite text
Lite mer text
Mycket mycket mer text

Kolumnerna blir inte lika höga - inte snyggt!

Ett sätt är att i kontainern lägga en bakgrundsbild med visuell avgränsning för varje kolumn. Denna metod är dock inte så effektiv om man i framtiden vill ändra bredden på kolumnerna. Här är en smart lösning som fungerar i de flesta webbläsare:

CSS:

div#kontainer{
overflow:hidden;
zoom:1;
}
div#kontainer div{ float:left;
width:100px;
margin-right:10px;
padding:5px;
background-color:#123456;
border:1px solid pink;
margin-bottom:-200px;padding-bottom:200px;
}
div#kontainer p{
color:#FFFFFF;
}
div#kontainer div.farg{
background-color:#122222;
}

Första kolumnen


Andra kolumnen kommer här.


Tredje kolumnen som är längst kommer här. Vi vill att de andra kolumnerna ska vara lika långa som denna.



Stylen är testad och fungerar i IE6+, Firefox 2.0.0.6
Upplagd av Inga kommentarer:
Etiketter:

Prickig styckeavdelare


En prickig linje gör du enkelt med hjälp av css.

När du skapar en <hr>-tagg (horisontell linje) så blir den prickig om du lägger till följande i din stylesheet:

hr{
border: none 0;
border-bottom:1px dashed #CCCCCC;
width:100%;
height: 1px;
}

Stylen är testad och fungerar i IE6+, Firefox 2.0.0.6
Upplagd av Inga kommentarer:
Etiketter:
Prenumerera på: Inlägg (Atom)