قالب گل صورتی بلاگفا

قالب گل صورتی یکی از قالب‌های ساده و شکیل با رنگ های روشن سفید و روشن است ، در این قالب از سایدبار کناری هوشمند چسبان استفاده شده ، منوی کشویی که در این قالب استفاده شده باعث شده قالب طرحی مرتب و منظم داشته باشه ، فونت گوگل هم در این قالب برای سرتیتر منو و لیست ها استفاده شده ، اگه به دنبال یک قالب ساده و مرتب هستین این قالب رو از دست ندین

  • فونت فارسی ساحل
  • منو و لیست کشویی
  • ریسپانسیو و واکنشگرا

کپی کد قالب

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>
        <-BlogAndPostTitle->
    </title>
    <meta http-equiv="content-language" content="fa">
    <meta name="description" content="<-BlogMetaDescription->">
    <meta name="generator" content="blogfa.com">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:title" content="<-AutoPageTitle->">
    <meta property="og:site_name" content="<-BlogTitle->">
    <meta property="og:description" content="<-BlogMetaDescription->">
    <meta name="twitter:title" content="<-AutoPageTitle->">
    <meta name="twitter:description" content="<-BlogMetaDescription->">
    <link rel="alternate" type="application/rss+xml" title="<-BlogTitle->" href="<-BlogXmlLink->" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet'>
    <link type="text/css" rel="stylesheet" href="https://cdn.rawgit.com/rastikerdar/sahel-font/v3.4.0/dist/font-face.css">
<style>
body{background-color:#fde8e3;background-repeat: no-repeat;background-attachment: fixed;font-family:sahel,sans-serif,tahoma,arial;font-size:13px;font-weight:400;color:#2e2928;margin:0;line-height:1.7em;overflow-x:hidden;background-size:cover}header .blackthemeMainBox {color:#fff;}a,button,h1,h2,h3,h4,h5,h6,input,span,ul{padding:0;text-decoration:none;margin:0;list-style:none}video{height:auto;margin:0 auto;border-radius:3px}table{width:100%!important;height:auto}blockquote{border-right:3px solid #ccc5b9;padding-right:10px}a{color:inherit}.post h2,a:hover{color:#ea7986}*{box-sizing:border-box}img,video{max-width:100%}.wrap{max-width:1200px;margin:auto;direction:rtl}.container{padding-right:15px;padding-left:15px}header{background:#ffe4e9 no-repeat center;background-size:cover;min-height:400px}header{background-image: url('http://s6.picofile.com/file/8392484292/flwer.jpg')}header .container{padding-top:70px;padding-bottom:70px;background:0 0;border:0;color:#fff;text-shadow:-1px 1px 1px #2e2928}header .container h1{margin-bottom:45px;font-size:40pt}.blackthemeMainBox{background:#fff;border:1px solid #decdc9;margin:auto;padding:45px}.menu ul,.partLeft .box h6,.partLeft .imgBox .img span,footer .wrap{display:flex;flex-direction:row;align-items:center}.appendMenu ul,.menu ul{font-family:Raleway,sahel,sans-serif,tahoma,arial;text-transform:uppercase}.menu ul{margin:0;position:relative;justify-content:space-around;padding:0 50px}.menu ul::after,.menu ul::before{width:50px}.menu ul::after,.menu ul::before,.post .postComment::before{height:1px;position:absolute;content:"";top:0;bottom:0;background:#decdc9;margin:auto}.menu ul::before{right:0}.menu ul::after,.post .postComment::before{left:0}.menu li{list-style-type:none;letter-spacing:2px;position:relative}.menu li a,.menu li:hover ul,video{display:block}.menu li a{padding:5px 0}.menu li ul{position:absolute;right:50%;transform:translateX(50%);width:200px;border:1px solid #decdc9;top:100%;background:#fff;padding:10px;text-transform:unset;font-family:unset;z-index:1}.menu li ul li{letter-spacing:0;padding:3px 0}.menu li ul li a,body{padding:0}.menu .menuHome{color:#ea7986;display:block}.appendMenu,.appendMenu .iconMenu,.appendMenu .menuHome,.menu .iconMenu,.menu li ul,.menu li ul::after,.menu li ul::before,.menuC{display:none}.appendMenu ul,.menu li{font-weight:600}.appendMenu ul li{color:#ea7986;padding:0;background:#fde8e3;margin:0}.appendMenu ul li a{padding:10px;display:block}.appendMenu ul li ul{padding:10px 0;background:#fff}.appendMenu ul li ul li{color:#2e2928;cursor:default;padding:3px 0;background:0 0}.appendMenu ul li ul li a{padding:0 10px}@media screen and (min-width:768px){.appendMenu{display:none!important}}.partWrap{display:flex;flex-direction:row;align-items:flex-start;padding:45px 0}.partWrap .partRight{width:100%;padding-left:45px}.partWrap .partLeft{min-width:300px;max-width:300px;padding-top:25px;position:sticky;position:-webkit-sticky;top:20px}.partLeft .box{padding:15px;border:1px solid #decdc9;margin-bottom:50px}.partLeft .imgBox{padding:5px;position:relative;user-select:none}.partLeft .imgBox .img::before{content:"";top:0;right:0;width:100%;height:100%;position:absolute;opacity:0;background-image:linear-gradient(-45deg,#ea7986,#fde8e3);background-image:-webkit-linear-gradient(-45deg,#ea7986,#fde8e3);background-image:-moz-linear-gradient(-45deg,#ea7986,#fde8e3);background-image:-ms-linear-gradient(-45deg,#ea7986,#fde8e3);transition:.5s all ease;-webkit-transition:.5s all ease;-moz-transition:.5s all ease;-ms-transition:.5s all ease}.partLeft .imgBox .img span{pointer-events:none;opacity:0;z-index:1;color:#fff;font-size:17px;position:absolute;top:0;left:0;text-align:center;width:100%;height:100%;margin:auto;justify-content:center}.partLeft .imgBox:hover .img span{opacity:1;transition:.3s all ease;transition-delay:.5s}.partLeft .imgBox .img{position:relative;transition:.3s all ease}.partLeft .imgBox img{display:block;width:100%}.partLeft .box h6,footer .wrap{justify-content:space-between}.partLeft .box h6{margin-top:-25px;background:#fff;font-size:13px;font-family:Raleway,sahel,sans-serif,tahoma,arial;text-transform:uppercase;letter-spacing:2px;color:#ea7986;padding:0 25px}.partLeft .box h6 i{font-size:18px}.partLeft .tagCloud li{display:inline-block;margin-left:5px;margin-bottom:5px}.partLeft .tagCloud li a{display:block;background:#ea7986;border-radius:5px;color:#fff;padding:5px 10px}.partLeft .box h6,.post,.postData{margin-bottom:25px}.post h2{font-weight:400;padding:15px 0;font-size:26px}.postData{color:#b0a5a2;font-style:italic}.post .continue,.postcontent{margin-bottom:10px}.post .continue{background:#ea7986;color:#fff;border-radius:5px;height:30px;line-height:30px;padding:0 10px;display:block;width:120px}.nextandprevious a:hover,.partLeft .imgBox:hover .img::before,.partLeft .tagCloud li a:hover,.post .continue:hover{opacity:.8}.nextandprevious a,.post .continue,.post .postComment{text-align:center;font-family:Raleway,sahel,sans-serif,tahoma,arial;text-transform:uppercase;letter-spacing:2px}.post .postComment{margin:25px 0;position:relative;direction:rtl;font-size:14px}.post .postComment::before{width:100%;z-index:0}.post .postComment div a{flex-direction:row;align-items:center;margin:auto;text-align:center;justify-content:center}.post .postComment div a::before{content:"\f004";font-family:FontAwesome;margin-right:10px}.post .postComment div a:hover{color:#2e2928}.post .postComment div{padding:10px 20px;background:#fff;z-index:1;position:relative;display:inline-block;color:#ea7986}.nextandprevious{margin:45px auto;max-width:400px}.nextandprevious a{background:#ea7986;color:#fff;border-radius:5px;height:30px;line-height:30px;padding:0 10px;display:block;width:170px;margin-bottom:10px}.nextandprevious .previouslink{float:right}.nextandprevious .nextlink{float:left}.clear{clear:both}footer{background:#ea7986;direction:rtl}footer .wrap{padding:25px 15px;color:#fff;font-size:14px;word-spacing:1px}footer .wrap span{margin:5px;display:block}footer .wrap a{border-bottom:1px dotted rgba(255,255,255,.5)}@media screen and (max-width:992px){.partWrap{flex-direction:column;justify-content:center;align-items:center}.partWrap .partRight{padding-left:0;padding-right:0}.partWrap .partLeft{min-width:auto;max-width:300px;width:100%;position:relative}}@media screen and (max-width:768px){.blackthemeMainBox,nav{padding:15px;border:0}nav{border:1px solid #decdc9}.appendMenu{border-top:1px solid #ccb2ac;margin-top:15px;padding:15px 0}.menu li,.menu ul::after,.menu ul::before{display:none}.menu .iconMenu{display:block}.menu ul{justify-content:space-between;padding:0}footer .wrap{flex-direction:column;justify-content:center}}@media screen and (max-width:576px){.nextandprevious .nextlink,.nextandprevious .previouslink{float:none;display:block;width:100%!important}}
</style>
    <script src="http://theme.blogfa.com/public/theme.1.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        try {
            cmt_caption[0] = "cms";
            cmt_caption[1] = "cm";
            cmt_caption[2] = "1 cm";
            cmt_caption[3] = "cm";
            cmt_blogid = "<-BlogId->";
        }
        catch (e) { }

    </script>

</head>

<body>
    <div class="wrap">
        <header>
            <div class="blackthemeMainBox container">
                <h1><a href="<-BlogUrl->">
                        <-BlogTitle->
                    </a></h1>
                <h2>
                    <-BlogDescription->
                </h2>
            </div>
        </header>
        <div class="blackthemeMainBox">
            <nav>
                <div class="menu">
                    <ul class="ulMenu">
                        <li class="menuHome"><a href="/">home</a></li>
                        <li><a href="javascript:void(0);">web</a>
                            <ul>
                                <BlogProfileLinkBlock>
                                    <li><a href="<-BlogProfileLink->">profile</a></li>
                                </BlogProfileLinkBlock>
                                <BlogEmailBlock>
                                    <li><a href="mailto:<-BlogEmail->">email</a></li>
                                </BlogEmailBlock>
                                <li><a href="<-BlogArchiveLink->">archive</a></li>
                                <li><a href="/posts/">titles</a></li>
                                <li><a href="/rss/">rss</a></li>
                            </ul>
                        </li>
                        <BlogLinkDumpBlock>
                            <li><a href="javascript:void(0);">link</a>
                                <ul>
                                    <BlogLinkDump>
                                        <li><a href="<-LinkUrl->" target="_blank" title="<-LinkDescription->">
                                                <-LinkTitle->
                                            </a></li>
                                    </BlogLinkDump>
                                    <li><a href="/links" onclick="return openlinks();">Archive</a></li>
                                </ul>
                            </li>
                        </BlogLinkDumpBlock>
                        <BlogCategoriesBlock>
                            <li><a href="javascript:void(0)">category</a>
                                <ul>
                                    <BlogCategories>
                                        <li><a href="<-CategoryLink->">
                                                <-CategoryName->
                                            </a></li>
                                    </BlogCategories>
                                </ul>
                            </li>
                        </BlogCategoriesBlock>


                        <BlogArchiveBlock>
                            <li><a href="javascript:void(0)">archive</a>
                                <ul>
                                    <BlogArchive>
                                        <li><a href="<-ArchiveLink->">
                                                <-ArchiveTitle->
                                            </a></li>
                                    </BlogArchive>
                                </ul>
                            </li>
                        </BlogArchiveBlock>

                        <BlogAuthorsBlock>
                            <li>
                            <li><a href="javascript:void(0)">author</a>
                                <ul>
                                    <BlogAuthors>
                                        <li><a href="<-AuthorLink->">
                                                <-AuthorName->
                                            </a></li>
                                    </BlogAuthors>
                                </ul>
                            </li>
                        </BlogAuthorsBlock>

                        <BlogLinksBlock>
                            <li><a href="javascript:void(0)">friend</a>
                                <ul>
                                    <BlogLinks>
                                        <li><a href="<-LinkUrl->" target="_blank">
                                                <-LinkTitle->
                                            </a></li>
                                    </BlogLinks>
                                </ul>
                            </li>
                        </BlogLinksBlock>
                        <li class="iconMenu"><a href="javascript:void(0)"><span class="menuM">menu</span><span
                                    class="menuC">close</span></a>
                    </ul>
                </div>
                <div class="appendMenu">

                </div>
            </nav>
            <div class="partWrap">
                <div class="partRight">
                    <BLOGFA>
                        <article>
                            <div class="post">
                                <h2><a href="<-PostLink->">
                                        <-PostTitle->
                                    </a></h2>
                                <div class="postData">
                                    <a href="<-PostLink->">+</a>
                                    <-PostDate-> | <-PostTime-> | <-PostAuthor->
                                </div>
                                <div class="postcontent">
                                    <-PostContent->
                                </div>
                                <BlogExtendedPost><a href="<-PostLink->" class="continue">continue</a>
                                </BlogExtendedPost>


                                <BlogPostTagsBlock>
                                    <div>
                                        <span class="fa fa-thumb-tack"> </span>
                                        <BlogPostTags separator=", "><a href="<-TagLink->">
                                                <-TagName->
                                            </a></BlogPostTags>
                                    </div>
                                </BlogPostTagsBlock>

                                <div class="postComment">
                                    <BlogComment>
                                        <div>
                                            <span dir="rtl" comment-for="<-PostId->"></span>
                                        </div>
                                    </BlogComment>
                                </div>

                            </div>
                            <!-- end post -->
                        </article>
                    </BLOGFA>

                    <BlogNextAndPreviousBlock>
                        <div class="nextandprevious">
                            <BlogPreviousPageBlock>
                                <a href="<-BlogPreviousPageLink->" class="previouslink">previous page</a>
                            </BlogPreviousPageBlock>
                            <BlogNextPageBlock>
                                <a href="<-BlogNextPageLink->" class="nextlink">next page</a>
                            </BlogNextPageBlock>
                            <div class="clear"></div>
                        </div>
                    </BlogNextAndPreviousBlock>
                </div>
                <div class="partLeft">
                    <div class="box imgBox">
                        <div class="img">
                            <span>
                                <-BlogTitle->
                            </span>
                            <img src="http://s6.picofile.com/file/8392484292/flwer.jpg" alt="">
                        </div>
                    </div>
                    <BlogProfile>
                        <div class="box">
                            <h6>about us <i class="fa fa-info"></i></h6>
                            <BlogPhoto><img src="<-BlogPhotoLink->"><br></BlogPhoto>
                            <-BlogAbout->
                        </div>
                    </BlogProfile>


                    <BlogTagsBlock>
                        <div class="box">
                            <h6>tags <i class="fa fa-tag"></i></h6>
                            <ul class="tagCloud">
                                <BlogTags>
                                    <li><a href="<-TagLink->">
                                            <-TagName->
                                        </a></li>
                                </BlogTags>
                            </ul>
                        </div>
                    </BlogTagsBlock>

                    <div class="box">
                        <h6>code <i class="fa fa-star"></i></h6>
                        <-BlogCustomHtml->
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer>
        <div class="wrap">
            <span>تمامی محتوای این وبلاگ محفوظ و متعلق به <a href="<-BlogUrl->">
                    <-BlogTitle->
                </a> میباشد</span>
            <span class="copyright">طراحی شده توسط <a href="http://blacktheme.ir/" title="طراحی قالب و طراحی سایت">بلک تم</a></span>
        </div>
    </footer>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
     $('.menu .ulMenu').clone().appendTo('.appendMenu');
     $('.iconMenu').click(function () {
         $('.iconMenu .menuC').toggle(0);
         $('.iconMenu .menuM').toggle(0);
         $('.appendMenu').slideToggle(500)
     });
 });
    </script>
</body>

</html>

قالب بلاگفا

پوسته گل صورتی بلاگفاقالب روشن بلاگفاقالب روشن صورتیقالب ساده بلاگفاقالب صورتی بلاگفاقالب عکس گل بلاگفاقالب گل بلاگفاقالب گل صورتی بلاگفا

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *