قالب گل صورتی بلاگفا
قالب گل صورتی یکی از قالب‌های ساده و شکیل با رنگ های روشن سفید و روشن است ، در این قالب از سایدبار کناری هوشمند چسبان استفاده شده ، منوی کشویی که در این قالب استفاده شده باعث شده قالب طرحی مرتب و منظم داشته باشه ، فونت گوگل هم در این قالب برای سرتیتر منو و لیست ها استفاده شده ، اگه به دنبال یک قالب ساده و مرتب هستین این قالب رو از دست ندین
- فونت فارسی ساحل
- منو و لیست کشویی
- ریسپانسیو و واکنشگرا
کپی کد قالب
<!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>