DCM
Download
Lineaments:
-DCM is 5 Column Template .
- Posts thumbnails, tabs , Side Drop down men.
- It's Free Photography Blogger templates .
-Compatible with All Major Browsers
-Best for Blogspot Gallery templates, , For Tech Blog.
- Designer name given inside theme file
-----------------------------------------------------------------------------------------------------
Title part of code here you can append word to title
<title>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<data:blog.title/>
<b:else/>
<data:blog.pageName/> | <data:blog.title/>
</b:if>
</title><b:include data='blog' name='all-head-content'/>
<link href='http://fonts.googleapis.com/css?family=Cabin:400,700|Playfair+Display+SC' rel='stylesheet' type='text/css'/>
-------------------------------------------------------------------------------------------------------
this body code of template you can change dimensions color , width , hight
body {
background:#2f2f2f;
font: 16px/1.5"Cabin", arial, sans serif;
color: #656565;
overflow:scroll;
}
#load-wrap, .load-wrap {
width:100%;
height:100%;
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-OblqFrrLoa9F1HVtOiY9lYt9fBlh026u_flT4kYqN1QCx7GSegYQ4X0LBjyP5oltDh_xalTWCGuHFFeYNzCDsskttOiH0S4tLKgx9VPXLx0dvypQMo3KhVVM-VDP6VxtTFMe2limg4BC/s0/overlay.png);
z-index:999;
}
.load-main {
text-align: center;
overflow:hidden;
position:absolute;
left: 44%;
width: 240px;
padding: 10px;
font-size:80%;
font-family:arial, sans serif;
color: #999;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#load-wrap .load-main {
top:40%;
}
.load-wrap .load-main {
bottom:80px;
background: rgba(0, 0, 0, 0.2)!Important;
;
}
a {
color: #656565;
text-decoration: none;
}
a:hover {
color: #777;
}
--------------------------------------------------------------------------------------
Header , container and wrapper part of code
#wrapper {
margin: 0 auto;
padding: 0 0 0 74px;
}
#right-profil .quickedit {
display:none;
}
#wrapper {
font-weight: 300;
line-height: 1.5;
text-align: justify;
position:relative;
width: 100%;
overflow: hidden;
}
#container {
margin: 0px 0 60px 0;
}
#wrapper p {
font-size: 140%;
}
header {
padding: 0 0.7em 0 0;
margin:1em 0;
}
header h1, header h3 {
overflow:hidden;
font-size: 2.125em;
line-height: 1.3;
margin: 0;
float: left;
font-weight: 400;
color:#f1f1f1;
text-overflow:ellipsis;
white-space:nowrap;
width:60%;
}
header h3 a {
color:#f1f1f1;
}
#header-inner {
width:66%;
float:left;
height:0!Important;
min-height:0!Important;
}
.descriptionwrapper {
float:left;
display:block;
clear:both;
font-size:10px;
margin:-6px 0 0 2px!Important;
padding:0!Important;
font-style:italic;
color:#777;
}
header nav {
float: right;
}
----------------------------------------------------------------------------------------------
Menu design dimensions are in this part of code
#hidde-left-menu {
position: fixed;
top: 0px;
left: -260px;
height: 100%;
min-height: 100%;
width: 320px;
margin:0;
padding:0;
z-index: 1000;
background-color: #333;
}
.menu {
width: auto;
height: auto;
position:absolute;
left:0;
right:4.1em;
margin:0;
padding:0;
}
.menu li {
list-style:none;
padding:0;
margin:0;
}
.menu > li > a {
background-color: #222;
border-bottom: 1px solid #111;
-webkit-box-shadow: inset 0px 1px 0px 0px #333;
-moz-box-shadow: inset 0px 1px 0px 0px #333;
box-shadow: inset 0px 1px 0px 0px #333;
width: 100%;
height: 2.75em;
line-height: 2.75em;
text-indent: 2.75em;
display: block;
position: relative;
font-size:14px;
font-family:Arial, sans-serif;
font-weight: 600;
color: #777;
text-shadow: 0px 1px 0px rgba(0, 0, 0, .5);
}
.menu ul li a {
background: #333;
border-bottom: 1px solid #252525;
width: 100%;
height: 2.75em;
line-height: 2.75em;
text-indent: 2.75em;
display: block;
position: relative;
font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 0.923em;
font-weight: 400;
color: #888;
}
.menu ul li:last-child a {
border-bottom: 1px solid #222;
}
.menu > li > a.active {
border-bottom: 1px solid #151515;
}
#cbp-vimenu {
position: absolute;
top: 0;
right: 0;
height: 100%;
list-style-type: none;
margin: 0;
padding: 0;
background-color:#222;
-webkit-box-shadow:0px 1px 3px black;
-moz-box-shadow:0px 1px 3px black;
box-shadow:0px 1px 3px black;
border-right:1px solid #333;
}
#cbp-vimenu li {
position:relative;
margin:0;
padding:0;
}
----------------------------------------------------------------------------------------------------
Social media icon design part you can change it
#cbp-vimenu li ul li:hover {
opacity: 1;
}
.icon-google-plus, .icon-facebook, .icon-twitter, .icon-feed, .icon-vimeo2, .icon-flickr, .icon-skype, .icon-linkedin, .icon-lastfm, .icon-user, .icon-rss-alt {
background-position:15px 20px;
background-repeat: no-repeat;
}
.icon-google-plus {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5gV8HqfaXb2ha6QADCbmjhfadRVS4TOXRRol-UFpqry1S84L11_DXMB2k3b09Uc-MTLW6zyyTh8Z2ieYEXcY9SLr5CrDfTqkUndbUyF4OSfgkAuBzaF_POx_LNrAH5-PTrp5_7u95kzUk/s0/google-plus.png);
}
.icon-facebook {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3FtEzVuhK1Ahv4A8cUiKxSVwKZJl_FQnZ4QDNfHHsmsteyEiMidmYVkUgrQcgZ8aSMJZTdRVF0FgslWJucKi7IOTuxlYRF8xDfIllqCPoMNxN77Bus_HUMwS5KZtRlI48UbnqUOv1hTiY/s0/facebook.png);
}
.icon-twitter {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqsxHZhi1v9hqOoqQu_PzJJtsLE5Gj6MdsEl2IQxcgzudCXodFEHAqVzh-n7LwAXRuN0NLT-iCZ9IOxZeRpZQkYOCEW7xk3BqG4S1DbvJnlvxCP97fYv90y8B6a_3pMcvLp3NmIwYQkCPI/s0/twitter.png);
}
.icon-feed {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIIm64lWwpubT-RtKVLRuAPFLi5QPhjo_ftrY3XHLbX54BwAUoDY904HYnmTOTG7XRrLL8TcVerONwuov2uspdNOgmywWvtO6KSZBJq4Zixs2o9debFAknUfTQSTHS6xGRzRwUvcts5yl6/s0/feed.png);
}
.icon-vimeo2 {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn9L8n_eWH95cWlRgkhcSHcCMwlxNd6K3rqPXD-MbQxNzrX3k9juJy7O1ZQSZawvtI7hwhmTYwhlw0u2Qqapi5YCMQurvwGlO8X4rlPxIOg3liV-gNPX1YMb9-Ioga8mnJ7kOzs1R-mlQg/s0/vimeo2.png);
}
.icon-flickr {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4AzdX1qfmRLRUyvwM5WZpwnlok1-PaWQeD3Guh8qL46sClh4zC8mT6kQP8CT2Hsan6oWn4Cw10Gf_VOW95E8K5DHJkgPkIGXMs_-4V3sC64yqnERsNdUEdFSYERc_ffiJBN6xdjIn-bb4/s0/flickr.png);
}
.icon-skype {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWyMwlvmcKLj6EYGBGsVOSpwLqk2O6XtlleVicfiNurSfB1I80POPsoZg5S681liRgKLPSTYstOOHEBIkzYaBMvhr1IwH8Q0n7bk52BjcuB3tnEm6yUagSkQRaG6RlK2CasHtbmryXdeVA/s0/skype.png);
}
.icon-linkedin {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0dknItLBqZNMeEEliPaxmg7Pkh1vWAZH4UIJCdK5NMXz647-PfLJPjW8_mKyKqjk_AibSn5QtJx5inxzvRI7uzTKo4vXipt_OoCeylf5eJ-L_kPStlFbQet9h4Jzq8xtqCfDUHOWHWpA1/s0/linkedin.png);
}
a.icon-home {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6Bj8OihhHUvqK7rr9gND257A98ivYjxamwBd5FV8dhqwKNAWWRItTUnnw9DUNnDQJpdjjIR7yov9KwEjZ4faQL37L5lsXz8fskfwdkyTkwjolWrSOvWSUNbkIvC_fUjf3vEdQBOhSCUyZ/s0/home.png);
}
a.icon-sidebar {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOa13e8ZkWwfEsyPAyaK_FUOMuaukLfnP4rqrsqwmh7VLL2cCpLjjeVS0PkbjIBwYn_IqlRmF4gkutSprl51UGV6OK4DNMKids_4KtKkx9Y84Uh_DW45okwehUycUHYVnjtmv7Mrp9NjPJ/s0/list-menu-icon.png);
}
a.icon-sidebar-close {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ6TwYxAvr3QlwW_DrCEYui4P5bt-iMRhAwS7k3LqGS-EvrPoMl1zOvDKmKvVCwlfDs9HGRzAp-oTjuHEbMS8BWP1F-m2qZUJERmvoMoYkpmJ_fmwuJxA1KfnYulMvIWzYWgJBKVDomghW/s0/close.png);
display:none;
}
a.profil {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh31jB8EKRReOVn4KV3kUPPKwHcA9aMTgJ-juRtFkHwjZfZexOGcPM1kVbUEh8PUPq96FF1htWB3jWKqPxhd3M56wnqsNVoMy_HjTP-2L3fvuciwD4_MFUZCqSsF81mOVMuQXRB7SOOvMIb/s0/user.png);
}
a.icon-tag {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinRgZyQQtPpjLbooWmeRSTLmKzwIiCoUZLoaRalJu_aOhwLlTW30DMiiUukAEpse1DNMVmSXLxL-FbCI4gS7rk6wMa8T6filLTRPAHO76zFRdbcpRaXyISIUL4CToihJPCHlpYAYzwVpLK/s0/tag.png);
}
a.icon-rss {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaxURqBsY4f65o20qogiQ0xAfN0eRnnffuSw7WhCpdtZbxxi6i775vMnoSuvArTCBnguu8IeJZXsYJe7abDF5DKHLP4nRHRvTaYLj45-5gFB4tzZ-4UdM9rEHA8zfRNCZyuVwIIyg5_Ka5/s0/rss-alt.png);
}
a.icon-store {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPTnfffwIjDskbA0dmWfA8mGja0LziEqn8JKVKnwgtjtI4S55v_MzHFArC7eEiD52FV3kZXVkzZFJ9rKauuLTdjsD2XhLLwUpijmAkg5jJUIGR1khuBG5aXKPjBMjB3qAhK0vpUg3RXULk/s0/left-fixed-menu-icon-store.png);
}
a.icon-search {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixcpmsSs6iiiw2c37KlVB_7t1OMe-SOH5Gu_mWHrsS28l6Y7b-_c4XEAMi6by67mBdM6EKXFBvpADmx9OeKH13veE2nfilxpqm2Fea6GXs1RKDsOVuv0p3ec9AzlNssIACKurCoPOCiXZT/s0/left-fixed-menu-icon-search.png);
}
0 comments:
Post a Comment