[2.8] Bootswatch using Bootstrap 3.0.0! (11 Themes)

You made an own skin or theme for phpMyFAQ. You can share it here with others!

Moderator: Thorsten

Post Reply
BCooper
Posts: 19
Joined: Mon Jul 01, 2013 10:37 am

[2.8] Bootswatch using Bootstrap 3.0.0! (11 Themes)

Post by BCooper »

Hi All!

11 themes for 2.8!!! I slightly cheated but all of the Bootswatch themes should be compatible.

I have modified the default phpMyFAQ 2.8 theme using the styles from Bootswatch 3 http://bootswatch.com using the latest Bootstrap 3.0.0 http://getbootstrap.com.

This is for the front end only, same backend design.

Bootstrap 3.0.0 requires some class updates in the code as well as the theme, for a couple of simple to install themes check out my other post viewtopic.php?f=9&t=15444.


(Step 1) Download Theme
Cerulean.PNG
Default Bootswatch - Cerulean
bootswatch-v1.zip

(Step 2) Install Base Theme

Extract the folder from the zip to phpmyfaq/assets/template/.

Go to Administration -> Configuration -> Main Configuration.

Change Template set to be used to Bootswatch.

Save Configuration.


(Step 3) Set a theme (If you want to change from the default)

Go to http://bootswatch.com/

Download the bootstrap.min.css for the style you like and save it to phpmyfaq/assets/template/bootswatch/css/ overwriting the default (Cerulean).

Currently the footer is set to a light colour (see image above) but you can change it to any colour you like, here is how:

Edit phpmyfaq/assets/template/bootswatch/css/style.min.css at the start of the actual code you will see the light colour footer:

#footer{background-color:#eee}

To change it to the darker colour you can try:

#footer{background:#28343b}

Or pick a new colour for a theme and share it here! I can added suggested colours to themes here.

And save.


(Step 4) Code Changes

Edit phpmyfaq\inc\PMF\Helper\Category.php change the class in line 95 from:

Code: Select all

"\n%s<ul class=\"nav nav-list\">\n%s<li%s>",
to:

Code: Select all

"\n%s<ul class=\"nav nav-pills nav-stacked nav-indent\">\n%s<li%s>",
Edit phpmyfaq\inc\PMF\Language.php change the class in line 249 from:

Code: Select all

$output    = '<select class="language" name="' . $id . '" id="' . $id . '" size="1"' . $onChange . ">\n";
to:

Code: Select all

$output    = '<select class="form-control language" name="' . $id . '" id="' . $id . '" size="1"' . $onChange . ">\n";
Edit phpmyfaq\inc\PMF\Sitemap.php change the class in line 125 from:

Code: Select all

$writeLetters = '<ul class="nav">';
to:

Code: Select all

$writeLetters = '<ul class="nav navbar-nav">';

(Step 5) Enjoy
Should be good to roll!


Revision History
v1 - Initial release
You do not have the required permissions to view the files attached to this post.
Last edited by BCooper on Wed Sep 04, 2013 9:02 am, edited 1 time in total.
Thorsten
Posts: 15560
Joined: Tue Sep 25, 2001 11:14 am
Location: #phpmyfaq
Contact:

Re: [2.8] Bootswatch using Bootstrap 3.0.0! (11 Themes)

Post by Thorsten »

Hi,

we're working on phpMyFAQ 2.9 using Bootstrap 3 as base :-)

bye
Thorsten
phpMyFAQ Maintainer and Lead Developer
amazon.de Wishlist
Zoker
Posts: 12
Joined: Thu Oct 10, 2013 7:42 pm

Re: [2.8] Bootswatch using Bootstrap 3.0.0! (11 Themes)

Post by Zoker »

Everything that should be able to be opened (like Comments, Mobile menu, related FAQs) are not working with the bootswatch theme :/

So all the toggle functions do not work!
shuaiscott
Posts: 1
Joined: Thu Jan 30, 2014 6:09 pm

Re: [2.8] Bootswatch using Bootstrap 3.0.0! (11 Themes)

Post by shuaiscott »

If you lock the whole thing, then the login page doesn't compile the theme. I don't think the indexLogin.tpl was created. I made my own. Feel free to include in your phpMyFAQ installation.

Thanks Thorsten and BCooper for your work!
You do not have the required permissions to view the files attached to this post.
WhiteCookie
Posts: 17
Joined: Thu Jun 26, 2014 6:31 am

Re: [2.8] Bootswatch using Bootstrap 3.0.0! (11 Themes)

Post by WhiteCookie »

the comment form box not working!
Post Reply