Thank you for downloading my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!
This theme is a responsive bootstrap based layout with two sidebars that you can customize.
All widgets for customizations are located into inc folder.
The theme use the awesomefont and you can place Font Awesome icons just about anywhere with the <i> tag.
<i class="fa fa-camera-retro"></i> normal font icon
I'm using various CSS files in this theme. The first one is a generic bootstrap core, after we have the bootstrap customization css and the fontawesome and weather icons css. Finally we have the general styling, such as anchor tag colors, social, weather, etc. Keep in mind, that these values might be overridden somewhere else in the file.
/* === General Section === */ some code /* === Social === */ some codeetc, etc.
If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.
If you want change the color of header widgets open and change the list-group-item class for the color desired.
<div class="list-group-item primary"> For this color
<div class="list-group-item success"> For this color
<div class="list-group-item info"> For this color
<div class="list-group-item warning"> For this color
<div class="list-group-item danger"> For this color
In the two sidebars we have put all widgets by a include php code.
You can include or exclude sigle widget by addig a double slash before the inclusion code
<!-- Include Widget --> <?php include(dirname(__FILE__).'/name of the widget.php'); ?> <!-- Exclude Widget --> <?php // include(dirname(__FILE__).'/name of the widget.php'); ?>
The file located into inc folder is inc.carousel.php
You can use this widget as a banner client widget. For each slide you can insert image, description and link. By default we have 3 slides and you have to customize by changing the path of the image, the title and the description
If you want more slides you have to add this code for each slide into the ol carousel-indicators class and change the data-slide-to number (ex: 3, 4, 5 etc...)
<li data-target="#carousel1" data-slide-to="3"></li>
and place this code for each new slide in the carousel-inner div
<div class="item">
<img src="http://placehold.it/550x300" alt="...">
<div class="carousel-caption">
<h3>Slide 3</h3>
<p>Image 3 Description</p>
</div>
</div>
For best resolution set the image size for each slide at 550x300
If you don't want caption and indicators you have to remove manually the compllete div carousel-indicators for the dot carousel indicators, the div carousel-caption for the caption slide and the relative controls at the end of the carousel-inner div.
If you use this widget open the file inc.weather.php in the inc folder and change the location for your desired city
find this code
$city="xxxxxx"; // City Name example "Rome" $country="xx"; //Two digit country code example "IT"
and change for your desired city.
To find your city go to openweathermap
For the google ad sense widget open the file inc.adsense.php in the inc folder and change the code with your publisher code by replacing the xxxxxxxxx
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Programmers -->
<ins class="adsbygoogle programmers"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxxx"
data-ad-slot="xxxxxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
For the google analytics tracking widget open the file inc.analyticstracking.php in the inc folder and change the code with your publisher code by replacing the xxxxxx-x code
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-xxxxxx-x', 'auto');
ga('send', 'pageview');
</script>
Open inc.facebook.php file locate in inc folder and change the relative code for display the like number and the like button
cnahge the id xxxxxxxx code
<?php $pageID = 'xxxxxxxxxx';
$info = json_decode(file_get_contents('http://graph.facebook.com/' . $pageID));
echo $info->likes; ?>
Change the avatar imge for your desired image.
to customize the date and the event change this code for your desired
<time datetime="2015-12-20"> <!-- change datetime to your desired date --> <span class="day">20</span> <!-- Event Day --> <span class="month">Dic</span> <!-- Event month --> <span class="year">2015</span> <!-- Event year --> <span class="time">09:30 AM</span> <!-- Event time --> </time> <div class="info"> <h2 class="title">2° Half Marathon</h2> <!-- Event Title --> <p class="desc">Policoro ore 09.30</p> <!-- Event Description --> </div>
Other little settinge are:
you have to change the path for the avatar image (40x40) or in images folder change avatar.jpg with your image that you rename avatar.jpg
to include a links widgtes download the blogroll plugin and activate it form the site.
The plugin can be downloaded from http://thepoulpe.net
change the path for the desired random photo folder to display (no thumb in the folder)
$path = 'data/images/photos/you folder desired/';
insert in the address column your address.
I've used.
Once again, thank you so much for downloading this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes, you might consider visiting the forum at PLUXML.ORG and asking your question.
Nicola Laviola