Monday, January 26, 2015

Create module and add CRUD Operation in YII, Step by step tutorial with pictures

Modular Programming is a software design technique that emphasizes separating the functionality of a program into independent, interchangeable modules, such that each contains everything necessary to execute only one aspect of the desired functionality.
  • Go to your project or create new project
You can create new YII project by running the following code:
yiiFrameworkPath/yiic webapp projectCreationPath/projectName

Saturday, January 17, 2015

Code for Image Upload restricting dublicate image with PHP

There are different ways of uploading image in database in php. The below code is uploading the image and instead of keeping the image in database, it sets the location of image in database e.g: image/gallery/picture1.jpg . The advantage of this approach is that, it reduces the load in database by reducing the size from image size to text size(instead of uploading images, it upload path to that image). Below is a working code for uploading image.

How to download youTube videos?

Downloading youtube video is easy and quick. Internet Download Manager (IDM) is the best fastest download manager ever. You can learn more about Internet Download Manager here. You can download the IDM from its official website www.internetdownloadmanager.com . But this works only for 30 days trial. Below is a full version application with crack and patch. You can use it for unlimited time. Click the below link to download this application

Tuesday, January 13, 2015

Code for creating Tooltip and Popover with Bootstrap

Tooltip and PopOvers are useful tips for user to displaying information. They help to reduce the page load and give much more information over hover. Below is code for creating it.
<!-- tooltip and popovers -->
<div class="container">
    <!-- tooltip -->
    <div class="row">
        <div class="col-md-12">

Code for creating Tabs with Bootstrap

Tabs are easy to create and also easy to use for user. This help to create user-friendly interface with lots of information compressed in respective tabs. Below is a working code for creating tabs. You can customize as per your need.
<!-- tabs -->
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h2>Tab</h2><hr/>

Code for creating Accordion with Bootstrap

accordion contain many different sections. so you can collapse or expand the sections. Only one section can be opened at one time.
<!-- accordion -->
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h2>Accordion</h2>

Monday, January 12, 2015

Code for creating Jumbotron, Image classes and Thumbnails

<!-- jumbotron -->
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div class="jumbotron">
                <h2>Jumbotron</h2>

Code for creating Forms with Bootstrap

Forms are essential element in web for interacting with the users. Forms also should be good enough to attract the user. So, forms should have good interface. Bootstrap provide nice interface and easy to control element. Below is a working code for a complete form:
<!-- Form -->
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h2>Contact Form</h2>

Code for creating Modal with Bootstrap

Modal is a dialog box which appear whenever you click link or button. It faces in when you click and the rest of the content fades out.
<!-- modal -->
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <a data-toggle="modal" href="#myModal">Login</a>

Font awesome in Bootstrap

Font-awesome is an open source project which provide free font icons. These days everybody use font rather than using images because it is scalable and can be re-size to any size and change color to any. First type Font-awesome on Google and click on the first link. you will be taken to font-awesome site. You can see many icon there.
To get started, click on the "get started" menu
Copy the css link and paste it on your index page. This will import the fonts.

Code to create responsive Grid with Bootstrap

Grid system consist of rows and columns. Each row consist of single line and each column consist of 12 columns. If you try to add more columns than 12 column in single row, the column after 12th column will automatically go to new row.
<!-- grid -->
<div class="container">
    <div class="row">
        <div class="col-md-4"> <!--col-md-4 can be change as per your need -->
            <h2>First Heading</h2>

Code to create responsive carousel with bootstrap

Oh!!!  creating carousel(slide) was never been easy before bootstrap. Creating carousel with responsive design is really challenging with javascript or using other language. Bootstrap makes it really simple in creating carousel. Below is a running code for creating carousel:
<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicator">
<li data-target="#myCarousel" data-slide="0" class="active"></li>

Sunday, January 11, 2015

Code to create responsive navigation bar with dropdown menu using bootstrap

Creating responsive navigation bar with dropdown menu in bootstrap is very simple. It is as easy to customize as to create it. Below is a running code for creating navigation bar(Menus) using bootstrap.
<!-- navbar with dropdown menu -->
<div class="navbar navbar-default navbar-fixed-top"> //creating fixed navbar menu you can change fixed to static
<div class="container">
<div class="navbar-header">