Krok za krokem: RapidGuestbook

07. 05. 2010 - kategorie: tutorial, plugin

Při hledání různých řešení pro vytvoření online návštěvní knihy jsem nakonec zvolil plugin RapidGuestbook a to i přesto, že jeho autor Dominique Mege nedávno ohlásil ukončení jeho vývoje pro nedostatek času. Tento plugin nabízí několik předností, které ho staví před mnoho jiných řešení:
  • střídmý a vkusný design, který se hodí i pro náročnější účely
  • velmi jednoduché nastavení a zprovoznění návštěvní knihy
  • možnost administrace - mazání nevhodných nebo vulgárních příspěvků
  • přebírá styly textu a odkazů z použitého tématu
  • pomocí CSS můžete dále upravovat styl, barvu a velikosti textu a podkladu
  • nevyžaduje databázi, příspěvky ukládá do souboru na vašem ftp serveru
  • ochrana proti spamu
  • možnost změny ikonek
  • stránkování - nikdy nevznikne nepřehledný sloupec příspěvků, ty starší se řadí na další stránky
RapidGuestbook vyžaduje pro svůj provoz pouze webhosting s PHP4 nebo vyšším. Plugin je zdarma.



Instalace neklade téměř žádné nároky na uživatele, pouze přidáte plugin obvyklým způsobem mezi ostatní stránky. Prostředí pluginu je ve francouzko-anglické lokalizaci. Nicméně není zde nic složitého:
  • záložka (1) ADMIN - vložte heslo pro administraci. Bude vyžadováno např. při mazání nevhodného příspěvku. To provedete tak, že na svých stránkách kliknete na ikonu pro přidání nového příspěvku, v adresním řádku prohlížeče přepíšete “message” na “admin”. Pak vložíte heslo a ID toho příspěvku, který chcete smazat.
  • záložka (2) Labels - zde můžete lokalizovat popisy k textovým polím ve formuláři pro vkládání nových příspěvků. U pole E-mail doporučuji použít “Email (skrytý)”, abyste dali uživatelům najevo, že emailová adresa se nezobrazuje u příspěvu, ale pouze v administračním rozhraní.
  • záložka (3) Entete / header slouží pro přidání textu do záhlaví
  • záložka (4) CSS obsahuje kaskádové styly, které definují vzhled návštěvní knihy


Především kaskádovým stylům bude věnována následující část. Také provedeme drobné korekce ve zdrojovém PHP kódu. Všechny tyto úpravy by vám měly pomoci k dosažení požadovaného vzhledu návštěvní knihy.

Začneme změnami v PHP: najděte na svém disku složku /Users/~/Library/Application Support/RapidWeaver/ a zde RapidGuestbookTdb.rwplugin. Na něj klikněte pravým tlačítkem myši a vybrte z nabídky: Show Package Contents, pak otevřete složku Contents a pak Resources. V ní najděte soubor template.php. Ten otevřete v textovém editoru, např. Smultron nebo TextWrangler. Zde nejprve změníme formát datumu z výchozího 2010/04/30 - 18:07 na 30. 04. 2010 - 18:07. Najděte řádek č. 322 a v něm opravte původní údaj date("Y/m/d - H:i"))); na date("d. m. Y - H:i")));
Další úpravou rozšíříme políčko pro CAPTCHA: opět v souboru template.php najděte řádek č. 222 a vněm opravte výchozí údaj size="4" maxlength="4" na size=“19” maxlength=“19” pokud chcete pole stejně široké jako jsou obrázky CAPTCHA nebo size=“25” maxlength=“25” pokud má mít šířku horních políček pro jméno a email. Poslední možností, kterou zmíním, je odstranění (mnou neoblíbeného) tlačítka “reset”. Změnu proveďte v řádcích 232 a 233 - tuto původní část:
echo "<input type=\"image\" name=\"Suite\" style=\"width: 33px; height: 33px;\" src=\"$applypng\" class=input> <button type=\"reset\" name=\"Suite\" class=input><img style=\"width: 33px; height: 33px;\" src=\"$clearpng\" alt=\"Clear\"></button>";
nahraďte touto:
echo "<input type=\"image\" name=\"Suite\" style=\"width: 33px; height: 33px;\" src=\"$applypng\" class=input>";
Nyní upravíme CSS v uživatelském prostředí pluginu - záložka (4) CSS. Jde pouze o modifikaci již existujících tříd a identifikátorů, proto neuvádím jejich původní podobu, pouze tu pozměněnou. Nahraďte tedy vždy celou příslušnou třídu (začíná tečkou) nebo identifikátor (začíná znaménkem #). Plugin bohužel neumožňuje vidět výsledek v Preview módu - je nutné stránku vždy publikovat a prohlédnout přímo na Internetu.

Styl jména (pseudo) - varianta 1 - pouze větším písmem
.pseudo {
font-size: 18pt;
font-weight: bold;
text-decoration: none;
}
Styl jména (pseudo) - varianta 2 - změna typu a barvy písma
.pseudo {
font-family: "Georgia", Times, serif;
font-style: italic;
font-size: 36px;
color: #FF0000;
font-weight: bold;
text-transform: uppercase;
text-decoration: none;
}
Barva textu ve formuáři u textových polí
#tablemessage {
background-color: none;
color: black;
width: 90%;
}
Barva rámečku okolo anti-spam
.antispam {
border: 1px solid;
color: #5D5D5D;
width: 100px;
}
Barva pozadí příspěvku a odsazení textu (padding)
#tabledisplay {
width: 100%;
margin-bottom: 10px;
padding: 15px;
background-color: #D7D7D7;
}
Ve výše zmíňěné složce Resources najdete také všechna tlačítka. Ta lze nahradit vlastními tak, aby korespondovala s úpravou stránek. Je však nutné zachovat rozměry. Pokud byste se potřebovali vrátit k původnímu CSS, najdete ho na stránkách autora pluginu.

tag: , , ,