Tutorials

Mailchimp signup form

Mailchimp signup form

MailChimp is a great tool for email marketing and supports, amongst many other features, also embedded signup forms for your website. MailChimp will provide a basic HTML code but unfortunately, it does not support Bootstrap framework. In this article, you'll learn how to embed a Mailchimp signup form on your website form and then convert it to a Bootstrap markup easily. As always,…

Bootstrap carousel guide

Bootstrap carousel guide

Bootstrap Carousel is a simple JavaScript component included right in the Bootstrap. It can be handy in many situations, mostly presenting the visual elements on your web page. In this guide, I will walk you through the basics to allow you using it on your page, describe its possible configuration options and I will show you how to easily modify its behaviour and make it full-screen or how to…

Lightweight social share icons

Lightweight social share icons

The problem with Facebook's and similar JavaScript share buttons or with services like SumoMe is that they add many additional HTTP requests and can slow down your site quite significantly. In today's tutorial, I would like to  show you how to create a set of working and lightweight social share icons for your website. I will teach you how to create a nicely looking modern…

How to build a working Bootstrap contact form

How to build a working Bootstrap contact form

Today I would like to show you how to easily build a working contact form using Bootstrap framework and AJAX with PHP. You will need some basic knowledge of HTML, CSS and Bootstrap CSS framework.  In the tutorial, I will walk you through the parts that will show you how to code the contact form in HTML, style it a bit and add real-time validation to the required fields.…

Google maps and Bootstrap Tutorial

Google maps and Bootstrap Tutorial

Do you have a contact page or contact section on your single-page website? If you publish your address, it is always a good idea to add also a map to enhance user experience and to increase awareness of your company/firm address. Today I would like to show you how to easily add a styled Google map to your website with custom marker and info window that opens when the user clicks on the…

How to change Bootstrap navbar height

How to change Bootstrap navbar height

Today I would like to share a quick tip with you that you will find handy in case you need to change Bootstrap navbar height. There are more methods but I would like to tell you about these two: Overriding Bootstrap CSS definitions If you are working with CSS files then this is my preferred method. You won't be editing Boostrap CSS files neither the Bootstrap theme's CSS but…