"Responsive Blogger Template rtl"
Bootstrap 4.1.1 Snippet by elegentsy

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html> <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'> <head> <b:include data='blog' name='all-head-content'/> <title> <b:if cond='data:blog.pageType == "index"'> <data:blog.pageTitle/> <b:else/> <b:if cond='data:blog.pageType != "error_page"'> <data:blog.pageName/> | <data:blog.title/> <b:else/> Page Not Found | <data:blog.title/> </b:if> </b:if> </title> <meta charset='utf-8'/> <meta content='width=device-width, initial-scale=1' name='viewport'/> <meta content='IE=edge' http-equiv='X-UA-Compatible'/> <!-- Latest compiled and minified CSS --> <link href='https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css' rel='stylesheet'/> <link href='//cdn.rawgit.com/morteza/bootstrap-rtl/v3.3.4/dist/css/bootstrap-rtl.min.css' rel='stylesheet'/> <!-- jQuery library --> <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script> <!-- Popper JS --> <script src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js'></script> <!-- Latest compiled JavaScript --> <script src='https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js'></script> <style> body { direction: rtl; text-align: right; } section.all { background: #ffffff; padding: 50px 0; } aside { background: #fafaff; border: 1px solid #eee; padding: 10px; } .fakeimg { height: 200px; background: #aaa; } </style> </head> <body> <nav class='navbar navbar-expand-md bg-dark navbar-dark'> <a class='navbar-brand' href='#'>Navbar</a> <button class='navbar-toggler' data-target='#collapsibleNavbar' data-toggle='collapse' type='button'> <span class='navbar-toggler-icon'/> </button> <div class='collapse navbar-collapse' id='collapsibleNavbar'> <ul class='navbar-nav'> <li class='nav-item'> <a class='nav-link' target="_blank" href='https://khamsat.com/programming/blogger/1290014-تصميم-قالب-بلوجر-اخباري-متجاوب'>Link</a> </li> <li class='nav-item'> <a class='nav-link' target="_blank" href='https://khamsat.com/programming/blogger/1290014-تصميم-قالب-بلوجر-اخباري-متجاوب'>Link</a> </li> <li class='nav-item'> <a class='nav-link' target="_blank" href='https://khamsat.com/programming/blogger/1290014-تصميم-قالب-بلوجر-اخباري-متجاوب'>Link</a> </li> </ul> </div> </nav> <header> <div class='jumbotron'> <div class='container'> <b:section class='header' id='header' maxwidgets='1' showaddelement='yes'/> <h1>Bootstrap Tutorial</h1> <p>Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile-first projects on the web.</p> <p>This is some text.</p> <p>This is another text.</p> <p> <a href="https://khamsat.com/programming/blogger/1290014-تصميم-قالب-بلوجر-اخباري-متجاوب" target="_blank" class="btn btn-lg btn-success btn-circle my-4 mr-3">Visit for more</a> </p> <b:section class='widget-adsense' id='widget-adsense' maxwidgets='1' showaddelement='yes'/> </div> </div> </header> <section class='all'> <div class='container'> <div class='col-md-8'> <article> <b:section class='main' id='main' maxwidgets='1' showaddelement='yes'/> <h2>TITLE HEADING</h2> <h5>Title description, 4-2-2020</h5> <div class='fakeimg'>Fake Image</div> <p>Some text..</p> <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p> <p> <a href="https://khamsat.com/programming/blogger/1290014-تصميم-قالب-بلوجر-اخباري-متجاوب" target="_blank" class="btn btn-lg btn-success btn-circle my-4 mr-3">Visit for more</a> </p> <br/> <h2>TITLE HEADING</h2> <h5>Title description, 4-2-2020</h5> <div class='fakeimg'>Fake Image</div> <p>Some text..</p> <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p> <p> <a href="https://khamsat.com/programming/blogger/1290014-تصميم-قالب-بلوجر-اخباري-متجاوب" target="_blank" class="btn btn-lg btn-success btn-circle my-4 mr-3">Visit for more</a> </p> </article> </div> <div class='col-md-4'> <aside>sidebar <b:section class='sidebar' id='sidebar' maxwidgets='' showaddelement='yes'/> </aside> </div> </div> <!--end container--> </section> <div class='jumbotron text-center' style='margin-bottom:0;clear: both;'> <b:section class='footer' id='footer' showaddelement='yes'/> <p>Footer</p> </div> </body> </html>

Related: See More

Light Bootstrap Dashboard React
Responsive Invoice template
BS4 clean & simple invoice template
Elegant Bootstrap 4 message chat box template

Questions / Comments: