A bbPress fórum egy újabb zseniális ingyenes rendszer, mely mögött a WordPress core fejlesztői állnak. Természetesen könnyedén telepíthető WordPress bővítményként és beépül a BuddyPress-be is. Elődje a bbPress 1.1 ágig egy teljesen különálló rendszer volt melyet össze is lehetett kötni a kedvenc tartalomkezelő rendszerünkkel a WordPress-el. Többeknek meggyűlt a baja a különálló telepítéssel mivel szerették volna, hogy egy kinézete legyen a fórumnak és az oldalnak is. Ezen segít a 2.0-ás ág amely mint fentebb írtam teljesen beépül és bővítményként telepíthető.
Telepítés
Első lépésként jelentkezzünk be WordPress admin felületünkre és kattintsunk a Bővítmények -> Új hozzáadása almenüpontra. Írjuk be a keresésbe a bbPress szót és felkínálja a telepítést. Kattintsunk a telepítés linkre, majd kapcsoljuk be használatra. (Szeretném megjegyezni, hogy nem minden szerver támogatja az automatikus telepítést. Ha szerverünk nem támogatja akkor töltsük le a legfrissebb verziót majd másoljuk fel a csomag tartalmát a `plugins` könyvtárba és adminisztrációs felületen kapcsoljuk be használatra.) Mivel a bbPress-ben alapértelmezetten nem tesznek nyelvet, ezt külön kell letöltenünk hozzá. A nyelvet letölthetjük a WordPress Core hivatalos fordítói oldaláról. Alapértelmezett névként jelen bejegyzés írásakor a `bbpress-plugin-hu.po` néven töltődik le a nyelvi fájl amelyet meg kell változtatni `bbpress-hu_HU.po` névre. Nyissuk meg PoEdit nevezetű programmal és csak kattintsunk a mentés gombra. Így a program generál nekünk egy `bbpress-hu_HU.mo` fájlt melyből a bbpress kiolvassa a nyelvet. (A PoEdit program használatáról bővebb tájékoztatást itt olvashatunk.) Töltsük fel alkönyvtárhelyesen a ‘/wp-content/plugins/bbpress/bbp-languages/’ könyvtárba a két fájlt. Innentől fogva a bbPress adminisztrációs felületen és a látogatói oldalon is Magyarul fog kommunikálni.
Beállítások
Adminisztrációs felületen kattintsunk az Beállítások -> Fórumok almenüpontban testre szabhatjuk bbPress bővítményünket. Itt több lehetőség van amit be lehet állítani de én ajánlom a telepítéssel kapott alap beállításokat. A következő rövid kódok (shortcodes) használható a bbPress-ben:
* Fórumok
[ bbp-forum-index] – A Fórum index és archívum oldalát jeleníti meg
[ bbp-single-forum id=$forum_id] – Egyetlen fórumot jelenít meg
* Témák
[ bbp-topic-index] – A Fórum témáinak index és archívum oldalát jeleníti meg
[ bbp-topic-form] – Új téma űrlapot jelenít meg
[ bbp-single-topic id=$topic_id] – Egyetlen témát jelenít meg
* Téma címkék
[ bbp-topic-tags] – A Fórum összes témájának címkéit jeleníti meg
[ bbp-single-topic-tag] – Egyetlen téma címkéit jeleníti meg
* Válaszok
[ bbp-reply-form] – Új válasz űrlapot jelenít meg
* Megtekintés
[ bbp-single-view] – Kapcsolódó témákat jelenít meg
* Fiók
[ bbp-login] – Bejelentkezési űrlapot jeleníti meg
[ bbp-register] – Regisztrációs űrlapot jeleníti meg
[ bbp-lost-pass] – Új jelszó kérése űrlapot jeleníti meg
Értelemszerűen egy shortcode így néz ki: [valami] Én azért hagytam a nyitó kapcsos zárójel után szóközt, hogy a bbPress ne épüljön bele ebbe a bejegyzésbe. Érdemes létrehozni 4 új oldalt (Fórum, Belépés, Regisztráció, Új jelszó kérése) a használathoz.
Sablon Testreszabás
Ha alapértelmezetten a Twenty Eleven sablont használjuk könnyedén alkalmassá tehetjük a bbPress használatához. Hozzunk létre a ‘wp-content/themes/’ mappában egy ‘bbp-twentyeleven’ nevű mappát. Ezután nyissuk meg kedvenc PHP Szerkesztő programunkat (PSPad Editor) és hozzunk létre egy cascading style sheets (css) fájlt amit majd mentés után style.css névre keresztelünk el. A tartalma a következő legyen:
[sourcecode language=”css”]/*
Theme Name: bbPress (Twenty Eleven)
Theme URI: http://blog.wphu.org/2012/06/10/bbpress-2-0-telepitese-es-testreszabasa/
Description: bbPress-t támogató Twenty Eleven sablon
Author: KardiWeb
Author URI: http://www.kardiweb.org/
Template: twentyeleven
Version: 1.0
Tags: bbpress, responsive, mobile, forum
*/
@import url("../twentyeleven/style.css");
/* adj. for responsive design, maximize space */
.bbPress div.bbp-breadcrumb {
font-size: 100%;
}
.bbPress #primary #content {
margin: 0 2% 25px 5%;
width: 90%;
}
.bbPress #content .entry-content, .bbPress .entry-header {
width: 100%;
}
.bbPress #primary #content form fieldset input[type="text"] {
width: 50%;
}
.bbPress #content table thead tr th,
.bbPress #content table tbody tr td {
padding-left: 10px;
overflow: hidden;
}
/* Give our sticky topic a nice blue pushpin */
.bbPress table.bbp-topics tr.super-sticky td.bbp-topic-title,
.bbPress table.bbp-topics tr.sticky td.bbp-topic-title {
background-image: url("images/bluepin.png");
background-repeat: no-repeat;
background-position: 8px 5px;
}
.bbPress table.bbp-topics tfoot tr td {
background-position: 0 -1px;
}
.bbPress table.bbp-topics tr.super-sticky td.bbp-topic-title a,
.bbPress table.bbp-topics tr.sticky td.bbp-topic-title a{
padding-left: 27px;
}
.bbPress .entry-content .entry-content {
padding-top: 0;
clear: both;
}
.bbPress h1.entry-title {
font-size: 26px;
padding: 0;
}
.bbPress h2.entry-title {
margin-top: 25px;
font-size: 20px;
float: left;
}
.bbPress .entry-content #forum-icon {
margin: -14px 30px 0 0;
display: inline;
float: left;
}
.entry-content div.bbp-template-notice{
display: block;
width: 98%;
}
.bbPress div.bbp-submit-wrapper {
padding-top: 10px;
clear: both;
float: none;
}
.bbPress #content form#searchform {
position: relative;
z-index: 100;
float: right;
}
.bbPress div#content table.bbp-forums tbody tr td.bbp-forum-info div.bbp-forum-description {
font-size: 90%;
}
.bbp-user-page hr {
clear: left;
}
#bbp-your-profile fieldset.bbp-form textarea,
#bbp-your-profile fieldset.bbp-form input,
#bbp-your-profile fieldset.bbp-form span.description {
width: 55%;
margin-left: 20%;
}
#bbp-your-profile fieldset.bbp-form div#password input,
#bbp-your-profile fieldset.bbp-form div#password span.description {
width: 95%;
margin-left: 0;
}
#bbp-your-profile fieldset.submit button {
float: none;
}
#forum_register {
font-size: normal;
margin:-12px 0 12px;
}
/* IE gravatar fix */
#author-avatar {
height: 60px;
width: 60px;
}[/sourcecode]
A megjegyzés résznél a ‘Template: twetnyeleven’ részhez ne nyúljunk mert ha elírjuk akkor nem fog működni a (Child theme) szülő sablon. Erre azért van szükség, hogy mikor a WordPress automatikusan frissíti magát és a Twenty Eleven sablont akkor ne vesszenek el a beállítások/módosítások. Mentsük el a fájlt style.css néven. A következő lépésben hozzunk létre egy PHP fájlt aminek a következő tartalmat írjuk be:
[sourcecode language=”html”]
<div id="primary">
<div id="content">
<div id="forum_register"></div>
</div>
<!– #content –>
</div>
<!– #primary –>
[/sourcecode]
Mentsük el ezt a fájlt ‘bbpress.php’ néven. Térjünk vissza a szerverre és másoljuk fel a style.css és bbpress.php nevű fájlokat a ‘wp-content/themes/bbp-twentyeleven/’ nevű mappánkba. Hozzunk létre ugyanebben a mappában egy ‘images’ nevű mappát amelybe ezt a fájlt másoljuk:
[sourcecode language=”text”]http://kardiweb.files.wordpress.com/2012/06/bluepin.png[/sourcecode]
A következő fájlt pedig a ‘wp-content/themes/bbp-twentyeleven/’ mappába másoljuk fel:
[sourcecode language=”text”]http://kardiweb.files.wordpress.com/2012/06/screenshot.png[/sourcecode]
A bbp-twentyeleven mappa struktúrája így fog kinézni:
[sourcecode language=”txt”]images //mappa
images/bluepin.png //képfájl
bbpress.php //php fájl
screenshot.png //képfájl
style.css //stíluslap
[/sourcecode]
Másoljuk fel az összes fájlt és ezután a Megjelenés -> Sablonok oldalon kapcsoljuk be. Ezután működnie kell elcsúszás nélkül az egész fórumunknak.
Videó bemutató
Megjegyzés
A bbPress honosítása jelen cikk írásakor 66%. Amennyiben tud angolul, és van kedve segíthet a hivatalos fordítói oldalon a honosításban.