Fork me on GitHub



Make donations with PayPal!
Goal: $100.00
Due Date: Oct 31
Gross Amount: $25.00
Net Balance: $23.72
Left to go: $76.28

kakos  ($25)Oct-25

GitHub Twitter

Learn XOOPS Core

Local Support


XOOPS Code hosted on SourceForge

Cumulus Tag Cloud

- 2 2.5 2.6 4 6 admin adslight Android AntiHarvesting AntiSpam API Apple Battlefield billige Blocks Bootstrap Captcha cell cent chronolabs Clicks Cloud content CĂN demo download Dresses facebook Fat floor Gateway giải Google Guide herre Home Honeypot html5 Human HỘ IP iPhone jQuery Language Law Legal List Loss module modules Monster new newbb news nhiệt NHÀ online PARK Payment phone PHP Prevention profile project Protector publisher RESIDENCE responsive review Rights Room security Sentry Signatures Signed site Smartphone Smarty Smoking Solution Spam stem Studio support tag tdmcreate The Theme themes tháp User userlog weight xoops Xortify XPayment ZendFramework

New Users

Registering user

# 139447


Welcome to XOOPS!


News archives

Updated! xBootstrap Theme v1.01 Final

Posted by AngeloRocha on 2014/2/11 10:17:19 (15657 reads) | Posted on Themes
Resized Image

Hello folks!
I bring to you the xBootstrap theme v1.01 Final! This was a beautiful work of XOOPS UI/UX Team, thank you guys and avant XOOPS!!!





1.01 Final 2014-02-11
- Bootstrap Upgraded to 3.1.0 (Angelo Rocha)
- Add xoops.css to folder theme (removed reset) (Angelo Rocha)
- Many css ajusts (Angelo Rocha)

1.01 Beta 3 2014-01-29
- Add xoopstube templates (Heyula)
- Add news templates (Angelo Rocha)
- Fixed HTML5 in IE 8 (Angelo Rocha)
- Fixed Reponsive Layout IE 8 (Angelo Rocha)

-1.01 Beta 2 2014-01-18
- Add TDMDownloads template (Angelo Rocha)
- Add Publisher templates (Bleekk)
- Add XOOPS Faq template (Heyula)
- Add Obituairies template (Heyula)

1.01 Beta 1 2014
- changed/added pictures (mamba)
- added /docs folder (mamba)

Printer friendly page Send this story to a friend Create a PDF from the article
Bookmark Me
Bookmark to Google Plus
The comments are owned by the author. We aren't responsible for their content.

Thanks to Angelo and the UI/UX team for such a wonderful job!!!!

The xBootstrap theme will be included in the upcoming XOOPS 2.5.7 Release

If you have ideas on how to improve this theme, please share it with the UI/UX Team
Published: 2014/2/11 21:28 • Updated: 2014/2/11 21:28
Thanks To all designers, nice and modern theme
Published: 2014/2/11 22:18 • Updated: 2014/2/11 22:55
Awesome theme....congrats to all

i suggest for xoops 2.57

to have ready with dummy custom blocks .. for all blocks positions

so the theme will look more better and fully utilise all the space just like in the screenshot above and instead of dummy data (Lorem ipsum) maybe we can put some useful guide especially for new users in the dummy blocks.....

block position as block title
in the block content maybe we can put some guide
like how
to edit/clone/disable blocks,
where to get help,
download theme,
download module etc
Published: 2014/2/12 2:39 • Updated: 2014/2/12 2:46
thanks Angelo,

there is a small bug.
in the style.css please delete line 22

the framework can not change for bigger screens then 960px.
Published: 2014/2/19 4:06 • Updated: 2014/2/19 4:06
Thanks Bleekk.
Published: 2014/2/23 20:27 • Updated: 2014/2/23 20:27
Package updated with new template for XOOPS Tube.

Same download link:

Demo link: ... glevideo.php?cid=7&lid=32
Published: 2014/3/19 11:27 • Updated: 2014/3/19 11:27
Published: 2014/3/20 12:04 • Updated: 2014/3/20 12:04
1. Since this is on 2.5.7 i echo the idea of posting a guid of how to edit it.

2. How can i remove the slide or adjust the size?

Many Thanks
Published: 2014/4/21 18:09 • Updated: 2014/4/21 18:09
For remove:

Go to file theme.html and remove line 46:
<{includeq file="$theme_name/tpl/slider.html"}>

For edit the slide go to directory tpl/ and edit the file slider.html

In style.css see lines 47, 48, 49, 50 and 51 for edit the style.

For use publisher slider see this comment: ... ootid=57058&#comment57058

Enjoy ^^
Published: 2014/4/21 21:24 • Updated: 2014/4/21 21:27
many thanks for the effort, do you know is there are any forum module with "responsive" capability?
And news module?

thanks in advance
Published: 2014/4/24 6:17 • Updated: 2014/4/24 6:17
Module for forum not yet.

News module:
News 1.67 and Publisher Module.
Published: 2014/4/24 7:56 • Updated: 2014/4/24 7:56
Just updated my 2.5.6 xoops site (i know its not recommend but i did :) )

Everything works fine, but i miss one of the importand module plugin for this theme: NEWBB
Please provide this because at this moment newbb looks ugly with this theme

Thanks for the hard work !
Published: 2014/4/24 13:22 • Updated: 2014/4/24 13:22
Hey there,

What a lovely theme.
I tried to fiddle around with it, but whatever I do, it keeps showing the original theme.
I cannot seem to edit the dropdown menu, I cannot seem to edit the text, I can't even find out where to edit the width.

I went over all files and edited the template.html file, but whatever I do, it keeps showing the original text, while it does show the altered slider.jpg files.

What am I doing wrong ? I'd like to base my DJ-site (non-commercial) on this theme.

Thanks in advance.


Published: 2014/4/27 10:43 • Updated: 2014/4/27 10:43
Go to xoops admin panel, click in preferentes -> general settings.

In option:
Check templates for modifications ?
If this option is enabled, modified templates will be automatically recompiled when they are displayed. You must turn this option off on a production site.

Click "Yes".

Published: 2014/4/27 11:22 • Updated: 2014/4/27 11:22
HI there, thanks for your reply.

I did that, but it keeps showing me the original/non-edited text.
Tried out Maintenance, didn't work either :(

Any other idea ? Thanks in advance.
Published: 2014/4/28 11:09 • Updated: 2014/4/28 11:09
I was really out of ideas, are changing the correct theme?
Published: 2014/4/28 12:40 • Updated: 2014/4/28 12:40
If the solution of Angelo dont work than you or your host have a cache mod like APC installed, ask your provider if they have similar module installed
Published: 2014/4/30 4:58 • Updated: 2014/4/30 4:58
Yes, I'm using a so called testlab. Only have the xBootstrap theme installed.

I'll look into that. Might contact the webhost.


I'm updating our testlab (xoops install just for testing) to Xoops 2.5.7 now, just to see if that works.
Published: 2014/4/30 9:22 • Updated: 2014/4/30 9:22
I dont knwo if more people has this problem but my glyphicons dont work
Instead of icons i see number in a box, i have tried the orginal glyphicon but still no luck
Published: 2014/5/5 10:48 • Updated: 2014/5/5 10:48
Thank you Angelo again for your nice Bootstrap theme. I just set this theme for one of my sites again (old theme was yours too) :) This one had 6 themes and 2 of them was yours hah :) 10x man really Take a look here (just set a little, i have more work on it)
I have a little problem...o god The script "mylinks.js" from the module "mylinks" stop working when i set your theme. This problem appears only for "xBootstrap Theme v1.03"
Do you have any idea whats happen?! Maybe some .js conflict..i dont know, i tried everithing :(
here for example: (the .gif links wont open)

10x man for your hard work :beer:
Published: 2014/5/12 13:07 • Updated: 2014/5/12 13:07
ooo buggy god, it was a .css error, not .js :) In bootstrap.min has class "hide". This class is doubling in milinks.css. Both respond as "display:none"
That was the problem :)
Sorry for my uproar.... the theme is supper!
Wish you best Angelo :)

@Yurdal, i think you should look something with your www/rewriterule.
Published: 2014/5/12 17:42 • Updated: 2014/5/12 17:42
How good it solve :P
Any problem or bug feel free to report.
Published: 2014/5/12 19:22 • Updated: 2014/5/12 19:22
Hi angelo,
como vai voce, tudo bom?

I install the theme on this site

Please tell me how I change the black color, at the top and below of the thema?
and how I change the speed of the slider?

My client has a logo with purple colors, and I want to see how it looks with those colors

Regards, um abraco
Published: 2014/5/13 19:08 • Updated: 2014/9/24 6:27
Hi ipwgc!

Go to "tpl" folder and open the file "nav-menu.html".

Find the line 2 and remove the class "navbar-inverse", see:

<div class="navbar navbar-inverse navbar-static-top global-nav">

<div class="navbar navbar-static-top global-nav">

For change footer bg color, go to "style.css" in line 57:

footer.footer{background:#111; color:#EAEAEA;}

For slider, add this code in "/js/js.js"
jQuery(document).ready(function($) {
interval:   5000,
pause:      "hover",
wrap:       true

To let slower, increase the parameter "interval", this value is in milliseconds, 5000 = 5s.

Example of js.js after this change:
// JavaScript Document
if (navigator.userAgent.match(/IEMobile/10.0/)) {
msViewportStyle document.createElement("style")

jQuery(document).ready(function($) {
interval:   8000//for 8s
pause:      "hover",
wrap:       true

Você fala português? ^^
Um abraço!
Published: 2014/5/13 19:46 • Updated: 2014/5/13 19:53
Please, make your requests here.
Published: 2014/5/14 5:27 • Updated: 2014/5/14 5:27
Dear AngeloRocha,

Thank you very much, this is a truly good job.
Published: 2014/6/26 11:56 • Updated: 2014/6/26 12:49

I what to hide the bar with the dots in the slideshow. How can I manage this?

Published: 2014/7/17 9:17 • Updated: 2014/7/17 9:18
Hi ...

After a quick look you have to remove or make the lines 4 to 7 comments ...
<!--<ol class="carousel-indicators">
li class="active" data-slide-to="0" data-target="#myCarousel"></li>
li data-slide-to="1" data-target="#myCarousel" class=""></li>

in file /tpl/slider.html.
Published: 2014/7/20 10:34 • Updated: 2014/7/20 10:34
works fine, thank you
Published: 2014/7/21 2:30 • Updated: 2014/7/21 2:30
Hi Angelo,

Thanks for the great theme.
I want to make the navbar fixed on top at all pages. But it will overlap on some pages. where should I add the padding-top in the CSS file?

Best Regards,

Published: 2014/8/27 4:12 • Updated: 2014/8/27 4:12

In navbar tpl change:




About bootstrap navbar:

Hope this helps
Published: 2014/8/27 7:12 • Updated: 2014/8/27 7:12
Thanks for the reply. but I don't know where to put the
padding-top: 50px;
in which file and which place?

Published: 2014/8/27 20:10 • Updated: 2014/8/27 20:10
Put style in file: style.css

Replace de css class in: "tpl/nav-menu.html"

Line 2:
<div class="navbar navbar-inverse navbar-static-top global-nav">

Change to:
<div class="navbar navbar-inverse navbar-fixed-top global-nav">

See files: ... /master/tpl/nav-menu.html
Published: 2014/8/28 7:16 • Updated: 2014/8/28 7:16
Thank you Angelo, it works perfect now.

And recently I'm trying to modify the font size of the letters in the nav-menu, but it seems all the contents in bootstrap.min.css are in one line, which is very hard to read and modify.

Or should I change these details from some other places?


Published: 2014/9/16 4:25 • Updated: 2014/9/16 4:25
First of all, thank you Angelo for your work on this theme, it is one of the best themes ever made for xoops - along with your "themefactory5-html5" theme.

but it seems all the contents in bootstrap.min.css are in one line, which is very hard to read and modify

I love this theme and I've been playing quite a bit with the css and enjoying the results but I agree, bootstrap.min.css is the worst formatted css file I think I've ever come across. I'm pretty sure Angelo didn't write this file because if he did it would be a far better formatted css file.

My question to Angelo is, how to get images in blocks to scale in size based on the browser width just like the "themefactory5-html5" theme, which I believe is also yours?

An example is, I have a block that displays the xoops banner. It is top center block. When viewed full screen on PC looks great. When viewed on mobile the site scales but the banner does not and exceeds the limits of the block and off screen. Also any Image placed in a block does not scale. But, in your "themefactory5-html5" theme images automatically scale and resize and shrink on smaller browser window.

I've tried to find the style in the "themefactory5-html5" theme but just can't work it out. I should have gone to college when I was younger lol.

Any ideas?

Best regards,
Published: 2014/9/17 3:47 • Updated: 2014/9/17 3:47
bootstrap.min.css should not be changed!
this is a bootstrap default css and it is very important not to change it. it makes a bootstrap update unpossible.

I would make the changes in style.css
There you can add the same classes you can find in bootstrap.min.css.
In this way you override the bootstrap.min.css stlyes.

Please look at the bootstrap documentation to get the images responsive
Published: 2014/9/17 8:50 • Updated: 2014/9/17 8:50

Please add following line to style.css

Published: 2014/9/17 8:54 • Updated: 2014/9/17 8:54
bootstrap.min.css should not be changed!
this is a bootstrap default css and it is very important not to change itit makes a bootstrap update unpossible.

I would make the changes in style.css
There you can add the same classes you can find in bootstrap
In this way you override the bootstrap.min.css stlyes.

Please look at the bootstrap documentation to get the images responsive

Excellent thanks for the link Bleekk

Published: 2014/9/17 18:38 • Updated: 2014/9/17 18:38
Is going to move to this theme?
Published: 2014/9/18 0:44 • Updated: 2014/9/18 0:44
I am almost sure that for the next xoops website design will be used a bootstrap based theme
Published: 2014/9/18 3:28 • Updated: 2014/9/18 3:28
Hi, Angelo,
- Eu falo Português, por isso não tem problema para se comunicar comigo.
- I speak Portuguese and spanish, so it not problem to communicating with me.

How I change the background color of the slader?, see this image
Resized Image

I'm working with the following versions:
- Theme Bootstrap 1.02 2014-06-08 Final
- Module Publisher $modversion['version'] = 1.02;
- XOOPS 2.5.7

This is the slider file

also see the js.js file
This is the js.js

This is the nav-menu

The whole site is working fine, exept need a darker color in the background to display the text color

Published: 2014/9/24 6:29 • Updated: 2014/9/24 6:38

Open style.css and add following
.carousel {

Published: 2014/9/25 2:35 • Updated: 2014/9/25 2:35
Thank you Bleekk
The carousel it fixed now,

The only thing to solve, is that the text appears above the photo, you have any idea

Published: 2014/9/25 19:19 • Updated: 2014/9/25 19:19
again edit style.css and add folllowing
.carousel-caption {

if this does not work then try following
@media screen and (min-width768px){
carousel-caption {

Published: 2014/9/26 3:21 • Updated: 2014/9/26 3:21
Thank Bleekk
The best option is this one,
the other option stops the carousel


Thank you.
Published: 2014/9/27 5:38 • Updated: 2014/9/27 5:38
Ongelorcha good job thank you,,,
I Astkhadd of this theme, but an Arab version you Arabization theme but the only error chasm I did not know how to convert the beginning of writing from left to right are shown toward English writing in Arabic,
They also list are from left to right and I use Arabic "" ""
Please give me the solution ???
(I want to turn the tide of writing Balthem by left to right all the theme)
Published: 2014/11/16 6:24 • Updated: 2014/11/16 6:24