DNNGo demo dnn skin unlimited color pack 029 > Features > Short Codes

Style 1

Flip Box

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Flip Box

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

SHare Design

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

More Information >

SHare Design

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

Go To Settings

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

More Information >

Go To Settings

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

SOURCE CODE

<div class="row">
    <div class="col-sm-4">
        <div class="flip_box flip_box_3">
            <div class="rotate">
                <div class="front"> <span class="fa fa-suitcase"></span>
                    <h3>Flip Box</h3>
                    <p>content text ...</p>
                    <a href="#">More Information ></a>
                </div>
                <div class="back">
                    <h3>Flip Box</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a>
                </div>
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <div class="flip_box flip_right flip_box_3">
            <div class="rotate">
                <div class="front"> <span class="fa  fa-life-ring"></span>
                    <h3>SHare Design</h3>
                    <p>content text ...</p>
                    <a href="#">More Information ></a>
                </div>
                <div class="back">
                    <h3>SHare Design</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a>
                </div>
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <div class="flip_box flip_top flip_box_3">
            <div class="rotate">
                <div class="front"> <span class="fa fa-bomb"></span>
                    <h3>Go To Settings</h3>
                    <p>content text ...</p>
                    <a href="#">More Information ></a>
                </div>
                <div class="back">
                    <h3>Go To Settings</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a>
                </div>
            </div>
        </div>
    </div>
<br />

Style 2

Flip Box

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Flip Box

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

SHare Design

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

SHare Design

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

Go To Settings

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Go To Settings

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

Do Our Best

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Do Our Best

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

SOURCE CODE

<div class="row">
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_box_2">
            <div class="rotate">
                <div class="front"> <span class="fa fa-suitcase"></span>
                    <h3>Flip Box</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>Flip Box</h3>
                    <p>content text ...</p>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_right flip_box_2">
            <div class="rotate">
                <div class="front"> <span class="fa  fa-life-ring"></span>
                    <h3>SHare Design</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>SHare Design</h3>
                    <p>content text ...</p>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_top flip_box_2">
            <div class="rotate">
                <div class="front"> <span class="fa fa-bomb"></span>
                    <h3>Go To Settings</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>Go To Settings</h3>
                    <p>content text ...</p>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_bottom flip_box_2">
            <div class="rotate">
                <div class="front"> <span class="fa fa-microphone"></span>
                    <h3>Do Our Best</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>Do Our Best</h3>
                    <p>content text ...</p>
                </div>
                </div>
            </div>
        </div>
    </div>
<br />

Style 3

Flip Box

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Flip Box

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

SHare Design

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

SHare Design

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

Go To Settings

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Go To Settings

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

Do Our Best

Nibhu len, quis faunissim hen urna ac, enia, magna dictuus nunc id elementum dictumst dignissim Tingue phasellus.

Do Our Best

Mauris at ultricies eros. Morbi vel dui nec arcu suscipit euismod. Phasellus pellentes untque lectus eget lac in venenatis tellus ligulas ipsum, euismod atras vulputate iltricies etri elit.

SOURCE CODE

<div class="row">
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_box_1">
            <div class="rotate">
                <div class="front"> 
                    <span class="fa fa-line-chart"></span>
                    <h3>Flip Box</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>Flip Box</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a> 
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_right flip_box_1">
            <div class="rotate">
                <div class="front"> 
                    <span class="fa fa-share"></span>
                    <h3>SHare Design</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>SHare Design</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a>
                 </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_top flip_box_1">
            <div class="rotate">
                <div class="front"> 
                    <span class="fa fa-cog"></span>
                    <h3>Go To Settings</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>Go To Settings</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a> 
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="flip_box flip_bottom flip_box_1">
            <div class="rotate">
                <div class="front"> 
                    <span class="fa fa-thumbs-o-up"></span>
                    <h3>Do Our Best</h3>
                    <p>content text ...</p>
                </div>
                <div class="back">
                    <h3>Do Our Best</h3>
                    <p>content text ...</p>
                    <a href="#" class="but">Read More</a> 
                </div>
            </div>
        </div>
    </div>
</div>