# Sora Crush

## Pro Blogger Theme for Free

WebSite Designer Contact

- created: 04/04/2014
- latest update: 04/12/2014
- by: Harman Singh Hira for SoraTemplates
- email:

### How to Make Full Width Page?

1. Go to Blogger Dashboard.

2. Make New Post or Page.

3. Add you Data.

4. When you finished writing Post or Page, click on HTML Button.

4. Paste below Codes.

    <style>.primary-sidebar, .entry-meta, .comments, .feed-links, .blog-pager{display:none;}
    .col100 {width:100%;}</style>

5. Add

### Buttons

1. Make new Post or Page.

2. Add below Button Codes to show Button.

    <a href="LINK" class="colabs-sc-button COLOR SIZE" ><span class="colabs-TYPE">NAME</span></a>
    <a href="LINK" class="colabs-sc-button COLOR SIZE" ><span class="colabs-TYPE">NAME</span></a>
    <a href="LINK" class="colabs-sc-button COLOR SIZE" ><span class="colabs-TYPE">NAME</span></a>
    <a href="LINK" class="colabs-sc-button COLOR SIZE" ><span class="colabs-TYPE">NAME</span></a>

3. Use below codes to add above Button Codes.

- Link:- URL of Website.
- Color:- red, green, dark and teal
- Size:- small, large and xl
- Type:- info, tick, download and note
- Name:- To show the Title of the Button

4. Done

### infolinks

1. Make new Post or Page.

2. Add below Codes.

    <span class="colabs-sc-ilink"><a class="TYPE" href="LINK" title="AttTitle">NAME</a></span>
    <span class="colabs-sc-ilink"><a class="TYPE" href="LINK" title="AttTitle">NAME</a></span>
    <span class="colabs-sc-ilink"><a class="TYPE" href="LINK" title="AttTitle">NAME</a></span>
    <span class="colabs-sc-ilink"><a class="TYPE" href="LINK" title="AttTitle">NAME</a></span>

3. Use below codes to add above Button Codes.

- Link:- URL of Website.
- Type:- info, tick, download and note
- Name:- To show the Title of the Button

4. Done

### Info Boxes

1. Make new Post or Page.

2. Add below Codes.

    <div class="colabs-sc-box info rounded ">Text here.</div> <div class="colabs-sc-box tick large full">Text here.</div>

3. Done.

### Typography

1. Make new Post or Page.

2. Add below Codes.

    <span class="dropcap">T</span>ext here

    <div class="colabs-sc-quote boxed">Text here</div>

    <div class="colabs-sc-quote">Text here</div>

    <span class="shortcode-highlight"><strong>Text here</strong> and here</span>

    <span class="shortcode-typography" style="font-family: 'Droid Sans Mono'; font-size: 20px; color: #f00000;">Text here</span>

3. Done.

### Typography Columns

1. Make new Post or Page.

2. Add below Codes.

- Two Column

    <div class="twocol-one"> Text here </div>
    <div class="twocol-one last"> Text here </div>

- Three Column

    <div class="threecol-one"> Text here </div>
    <div class="threecol-one"> Text here </div>
    <div class="threecol-one last"> Text here </div>

- Four Column

    <div class="fourcol-one"> Text here </div>
    <div class="fourcol-one"> Text here </div>
    <div class="fourcol-one"> Text here </div>
    <div class="fourcol-one last"> Text here </div>

- Five Column

    <div class="fivecol-one"> Text here </div>
    <div class="fivecol-one"> Text here </div>
    <div class="fivecol-one"> Text here </div>
    <div class="fivecol-one"> Text here </div>
    <div class="fivecol-one last"> Text here </div>

- Six Column

    <div class="sixcol-one"> Text here </div>
    <div class="sixcol-one"> Text here </div>
    <div class="sixcol-one"> Text here </div>
    <div class="sixcol-one"> Text here </div>
    <div class="sixcol-one"> Text here </div>
    <div class="sixcol-one last"> Text here </div>

3. Done.

### list

1. Make new Post or Page.

2. Add below Codes.

- Red Cross

    <div class="shortcode-unorderedlist red-x">
    <ul>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    </ul>
    </div>

- Tick

    <div class="shortcode-unorderedlist tick">
    <ul>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    </ul>
    </div>

- Bullet

    <div class="shortcode-unorderedlist bullet">
    <ul>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    </ul>
    </div>

- Green Dots

    <div class="shortcode-unorderedlist green-dot">
    <ul>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    </ul>
    </div>

- Arrows

    <div class="shortcode-unorderedlist arrow">
    <ul>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    </ul>
    </div>

- Stars

    <div class="shortcode-unorderedlist star">
    <ul>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    <li>Place your list items here</li>
    </ul>
    </div>

3. Done.

### Gallery

1. Make new Post or Page.

2. Add below Codes.

          <ul class="gallery-list">

    <li class="gallery-item">
           <a href="FULL_IMAGE_LINK" title="TITLE" rel="lightbox">
            <img src="THUMB_IMAGE_LINK" class="colabs-image"/>
           </a>
    </li>

          </ul>

3. Add more Li Codes to show More Images.

4. Done.

### Date Settings

1. Go to Blogger Dashboard.

2. Click Settings.

3. Then click on Language and formatting

4. Change Time setting according to below Image.

5. Save it.