Másolja a tervezés, mint a helyszínen, mnogoblog

Néha ráakad egy telek egy szép design, és szeretné tudni, hogy lehet-e tenni valamit, mint otthon. Tehát itt fogunk beszélni róla.
Töltse le a forráskódot a cikket alatt lehet

És, hogy a pont ...)

1. Ismerje meg, mi a téma (sablon) használunk az oldalon, mivel ez elsősorban meghatározza általános design és a funkcionalitás.

És ezért, ha mi meg ezt a témát, hogy a webhely, akkor elég közel, hogy közelebb kerüljünk a kívánt mintát.

Az első dolog - annak meghatározása, hogy milyen motor (CMS), hogy a honlapon.

Van egy nagyon hasznos internetes szolgáltatásokat, amelyek segítenek azonosítani CMS helyszínen, például:

Egyszerűen adja meg a nevét az oldalon, és látni a jeleit a CMS fogja találni ezt a szolgáltatást.

A szükséges hely alapján WordPress - tökéletes! Tehát a téma alkalmas a honlapunkon.

Megyünk tovább, és nézd - mi figyelemmel használja az oldalt.

Hogyan kell csinálni, ez elég egyszerű.

Vegyük példának a Firefox böngészőt.

1. Nyissa meg a kívánt minket a helyszínre, így mnogoblog.ru.

2. Nyissa meg a „Oldal forrása” Ehhez kattintson a Ctrl + U (egyidejű leszorítását a két kulcs: CTRL és U), vagy menjen a böngésző menüben kattintson a „Tools”, majd az al-elem „Web Development”, és úgy dönt, hogy a vonal a „oldal forrása”.

3. keresünk egy sort egy linket a fájlt style.css stílusban.

Így néz ki a honlapomon:

Mivel könnyebb megtalálni?

A megjelenő ablakban az „Oldal forrása” válassza az „Edit” menüpontot a felső és az úgynevezett „Find”.

És adja meg a keresett szöveget «css» (idézőjelek nélkül), vagy csak «style.css» (idézőjelek nélkül).

Mit ad nekünk ezt a vonalat?

Ez ad nekünk a nevét a téma, hogy használják a honlapomon wordpress téma «glossyblue», mert használja a stílus-fájlt egy oldalon jelenleg mnogoblog.ru.

Most már a kalapács egy kereső lekérdezés: «wordpress téma glossyblue» - és akkor felfedezni témám gond nélkül (bár én egy kicsit módosítva).

Azonban ez a módszer meghatározására témák esetleg nem működik, így a webhely tulajdonosa átnevezni a mappát a témát.

Annak érdekében, hogy megoldja a rejtvényeket, van egy kis trükk - főleg témák közé képernyőképet (kép nézne a téma telepítés után) -, hogy ez, és meg kell találni.

Azaz, például a honlapján, és én majd nevezze át a menet glossyblue mytheme, majd megtalálni a style.css stílus fájl látni fogja a forráskódot az oldalon a következő sort:

Egyértelmű, hogy az igazi neve a témák nem mytheme, de aztán találtam a nevét?

Elég, hogy vezessen egy böngésző útvonal helyett a végén style.css a screenshot.jpg vagy screenshot.png.

Például ha tettem a helyszínen a böngészőben a következő URL-t, akkor látom screenshot glossyblue témák:

Most meg kell menteni a képernyőképet a számítógépén.

Ezután meg kell használni a kereső a képeket, mint például a Google kereső:

kattintson a fenti keresősávot a kamera ikonra, majd adja meg az útvonalat, hogy a letöltött téma screenshot minket.

És a kérdés a Google-találatok az 5-helyzetben fordultam a honlapom fejlesztő téma.

2. Tárgy másolt, most keresi, hogyan lehet létrehozni érdekes design elemek mi tetszett a hely.

Akkor használja a böngésző kiterjesztés.

Például a Firefox böngésző - a Firebug.

Hogyan kell telepíteni?

Ahhoz, hogy ez a Firefox kell menni egy menüpontot a böngésző „Eszközök”, majd válassza ki az elemet „Kiegészítők”, és a keresősáv, írja Firebug.

Hogyan kell használni?

Én az alábbi funkció (jelölve a képen):

Hogyan kell használni ezt a funkciót?

Miután rákattintott a Firebug bővítmény gomb, tartsa az egeret a kívánt területen a weboldal, és a bal oldali Firebug bővítmény lesz képes betartani területeken HTML kódot. kialakulásáért felelős ezen tervezési elemeket (ezek lesznek emelve, kék háttér), míg a jobb oldali részében ablakban láthatjuk a stílusok, az elemhez style.css stíluslap fájlt.

Ezen az oldalon elem, amely felett az egérkurzor megállapítható Firebug plug-in erők egy kék keretet.

A fenti képen, azt hangsúlyoztam képet házak és látta, hogy egy fogoly a div nevű épületek, és a következő paramétereket van bejegyezve a style.css stíluslap fájl:

background: url ( «images / funkcionalitású-buildings.png») no-repeat scroll 0 0 átlátszó;