Sunday, 16 October 2016

Generic Blogger Template

Generic Blogger Template


------------------------------------------------------------------------------------------------------------
COPY AND PASTE BELOW CODE
0)BLOGGER TEMPLATE HAS WIDGET BASED LAYOUT 
1) WIDGET LIKE NAVEBAR, HEADER,SIDEBAR,FOOTER
WIDGET SHWO EXTRA DIV TAG SOME DIV TAG WE USE WITH CSS CODE
AND GIVE DIV COLOR BACK GROUND COLOR
2)ADD HTML CODE
3) USE FIREBUG TOOL OR CTRL+SHIFT + I F12 TOOL
4) YOU NEED TO KNOW HOW TO WRITE CSS ID OR CLASS SELECTORS
OR CSS CODE WITHOUT CSS ID OR CLASS
5) HOW TO WRITE INLINE CSS CODE
6) BLOGGER HAS MORE  HTML DIV ID  THAN CSS DIV ID CODE

 ------------------------------------------------------------------------------------------------------------
READ MORE:
------------------------------------------------------------------------------------------------------------
http://www.w3schools.com/cssref/sel_class.asp
http://www.w3schools.com/css/css_syntax.asp
http://fbgadgets.blogspot.co.uk/2016/08/button-change-into-dropdown-menu.html
http://fbgadgets.blogspot.co.uk/2016/09/edit-html-source-code.html
http://fbgadgets.blogspot.co.uk/2016/12/responsive-blogger-template-fb-gdgets.html

RESPONSIVE BLOGGER TEMPLATE - YOUTUBE

https://www.youtube.com/watch?v=AIY1doPtj_Q
16 mins ago - Uploaded by SAVE MONEY
RESPONSIVE BLOGGER TEMPLATE FB GADGETS ... New Responsive Template "Fluid" - Fresh ...
------------------------------------------------------------------------------------------------------------

<?xml version="1.0" encoding="UTF-8" ?>
<html 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><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: GENERIC BLOGGER TEMPLATE HEADER WRAPPER
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */
body {
background: White;
color: Black;
font: 12px Verdana;
margin:0;
text-align:center;
border: 2px solid Black;
}

/* Header
-----------------------------------------------
*/
#header-wrapper {
border: 2px solid Black;
}
#header-inner {
border: 2px solid Black;
}
#header {
border: 2px solid Black;
}
.title {
border: 2px solid Green;
background-color:Yellow;
color:red;
}
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
border: 2px solid #000000;
}
#main-wrapper {
width: 900px;
float: left;
padding: 5px;
border: 2px solid Red;
}
#sidebar-wrapper {
width: 300px;
float: right;
border: 2px solid Black;
}
.sidebar h2 {
border: 2px solid Red;
}


/* Footer
----------------------------------------------- */
#footer-wrapper {
border: 2px solid Green;
background-color:Yellow;
height: 50px;
}

]]></b:skin>

</head>

<body>

<div id='outer-wrapper'>

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='WhereIsMyIpAdress (Header)' type='Header'>
</b:widget>
</b:section>
</div>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>


<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
</b:widget>
</b:section>
</div>

<div class='clear'>&#160;</div>

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div>

</body>
</html>

------------------------------------------------------------------------------------------------------------
OR USE THIS CODE
------------------------------------------------------------------------------------------------------------
<html>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: GENERIC BLOGGER TEMPLATE HEADER WRAPPER
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */
body {
background: White;
color: Black;
font: 12px Verdana;
margin:0;
text-align:center;
border: 2px solid Black;
}

/* Header
-----------------------------------------------
*/
#header-wrapper {
border: 2px solid Black;
}
#header-inner {
border: 2px solid Black;
}
#header {
border: 2px solid Black;
}
.title {
border: 2px solid Green;
background-color:Yellow;
color:red;
}
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
border: 2px solid #000000;
}
#main-wrapper {
width: 900px;
float: left;
padding: 5px;
border: 2px solid Red;
}
#sidebar-wrapper {
width: 300px;
float: right;
border: 2px solid Black;
}
.sidebar h2 {
border: 2px solid Red;
}


/* Footer
----------------------------------------------- */
#footer-wrapper {
border: 2px solid Green;
background-color:Yellow;
height: 50px;
}

]]></b:skin>

</head>

<body>

<div id='outer-wrapper'>

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='data:blog.homepageUrl' type='Header'>
</b:widget>
</b:section>
</div>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>


<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
</b:widget>
</b:section>
</div>

<div class='clear'>&#160;</div>

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div>

</body>
</html>


------------------------------------------------------------------------------------------------------------
OR USE THIS CODEWITH OUT COMMENT BOX
------------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8" ?>
<html 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><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: GENERIC BLOGGER TEMPLATE HEADER WRAPPER
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */
body {
background: White;
color: Black;
font: 12px Verdana;
margin:0;
text-align:center;
border: 2px solid Black;
}

/* Header
-----------------------------------------------
*/
#header-wrapper {
border: 2px solid Black;
}
#header-inner {
border: 2px solid Black;
}
#header {
border: 2px solid Black;
}
.title {
border: 2px solid Green;
background-color:Yellow;
color:red;
}
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
border: 2px solid #000000;
}
#main-wrapper {
width: 900px;
float: left;
padding: 5px;
border: 2px solid Red;
}
#sidebar-wrapper {
width: 300px;
float: right;
border: 2px solid Black;
}
.sidebar h2 {
border: 2px solid Red;
}


/* Footer
----------------------------------------------- */
#footer-wrapper {
border: 2px solid Green;
background-color:Yellow;
height: 50px;
}

]]></b:skin>

</head>

<body>

<div id='outer-wrapper'>

<div id='header-wrapper'>
<div class='header section' id='header'><div class='widget Header' data-version='1' id='Header1'>
<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>General Magic</h1>
</div>
<div class='descriptionwrapper'>
<p class='description'><span>
</span></p>
</div>
</div>
</div></div>
</div>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog' visible='true'>
<b:includable id='main' var='top'>
<b:if cond='!data:mobile'>
<!-- posts -->
<div class='blog-posts hfeed'>

<b:loop values='data:posts' var='post'>

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>

<div class='post-outer'>
<b:include data='post' name='post'/>
<b:include cond='data:blog.pageType in {&quot;static_page&quot;,&quot;item&quot;}' data='post' name='comment_picker'/>
</div>
<!-- Ad -->

</b:loop>
<b:if cond='data:numPosts != 0'>
&lt;/div&gt;&lt;/div&gt;
</b:if>
</div>

<data:top.googlePlusBootstrap/>
</b:if>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'/>
<b:includable id='backlinks' var='post'/>
<b:includable id='comment-form' var='post'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='comment_count_picker' var='post'/>
<b:includable id='comment_picker' var='post'/>
<b:includable id='comments' var='post'/>
<b:includable id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='iframe_comments' var='post'/>
<b:includable id='mobile-index-post' var='post'/>
<b:includable id='mobile-main' var='top'/>
<b:includable id='mobile-nextprev'/>
<b:includable id='mobile-post' var='post'/>
<b:includable id='nextprev'/>

<b:includable id='post' var='post'>

<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title' itemprop='name'>
<b:if cond='data:post.link or (data:post.url and data:blog.url != data:post.url)'>
<a expr:href='data:post.link ? data:post.link : data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>

<!-- Then use the post body as the schema.org description, for good G+/FB snippeting. -->
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>

<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>


</div>

</div>

</b:includable>

<b:includable id='postQuickEdit' var='post'/>

<b:includable id='shareButtons' var='post'/>
<b:includable id='status-message'/>
<b:includable id='threaded-comment-form' var='post'/>
<b:includable id='threaded_comment_js' var='post'/>
<b:includable id='threaded_comments' var='post'/>
</b:widget>
</b:section>
</div>


<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
</b:widget>
</b:section>
</div>

<div class='clear'>&#160;</div>

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div>

</body>
</html>
----------------------------------------------------------------------------


----------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------
OR USE THIS CODE
http://fbgadgets.blogspot.co.uk/2016/12/generic-blogger-template-parts.html
WHAT IS IN BLOG?

POST DATE POST TITLE POST BODY IN BLOG - YouTube

https://www.youtube.com/watch?v=whcmycpNZPE
4 mins ago - Uploaded by SAVE MONEY
POST DATE POST TITLE POST BODY IN BLOG ... http://fbgadgets.blogspot.co.uk/2016/... http://fbgadgets ...
1.       POST DATE
2.       POST TITLE
3.       POST BODY
4.       POST READ MORE
5.       B IF COND DIV
6.       NOT SHOW READ MORE LINK
NOTE THAT:
B IF COND DIV GIVE HELPS IN NOT SHOW READ MORE LINK AFTER OPEN POST BUT WITHOUT 
B IF COND DIV IT SHOW READ MORE LINK
------------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8" ?>
<html 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><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: GENERIC BLOGGER TEMPLATE HEADER WRAPPER
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */
body {
background: White;
color: Black;
font: 12px Verdana;
margin:0;
text-align:center;
border: 2px solid Black;
}

/* Header
-----------------------------------------------
*/
#header-wrapper {
border: 2px solid Black;
}
#header-inner {
border: 2px solid Black;
}
#header {
border: 2px solid Black;
}
.title {
border: 2px solid Green;
background-color:Yellow;
color:red;
}
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
border: 2px solid #000000;
}
#main-wrapper {
width: 900px;
float: left;
padding: 5px;
border: 2px solid Red;
}
#sidebar-wrapper {
width: 300px;
float: right;
border: 2px solid Black;
}
.sidebar h2 {
border: 2px solid Red;
}


/* Footer
----------------------------------------------- */
#footer-wrapper {
border: 2px solid Green;
background-color:Yellow;
height: 50px;
}

]]></b:skin>

</head>

<body>

<div id='outer-wrapper'>

<div id='header-wrapper'>
<div class='header section' id='header'><div class='widget Header' data-version='1' id='Header1'>
<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>General Magic</h1>
</div>
<div class='descriptionwrapper'>
<p class='description'><span>
</span></p>
</div>
</div>
</div></div>
</div>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
 <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog' version='1' visible='true'>

<b:includable id='main' var='top'>
<div class='blog-posts hfeed'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>
<b:include data='post' name='post'/>
</b:loop>
</div>
</b:includable>

<b:includable id='backlinkDeleteIcon' var='backlink'/>
<b:includable id='backlinks' var='post'/>
<b:includable id='comment-form' var='post'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='comment_count_picker' var='post'/>
<b:includable id='comment_picker' var='post'/>
<b:includable id='comments' var='post'/>
<b:includable id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='iframe_comments' var='post'/>
<b:includable id='mobile-index-post' var='post'/>
<b:includable id='mobile-main' var='top'/>
<b:includable id='mobile-nextprev'/>
<b:includable id='mobile-post' var='post'/>
<b:includable id='nextprev'/>

<b:includable id='post' var='post'>

<h3 class='post-title entry-title'>
<a expr:href='data:post.url'><data:post.title/></a>
</h3>

<!-- Then use the post body as the schema.org description, for good G+/FB snippeting. -->
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url'>Read More >></a>
</div>
</b:if>

</b:includable>


<b:includable id='postQuickEdit' var='post'/>
<b:includable id='shareButtons' var='post'/>
<b:includable id='status-message'/>
<b:includable id='threaded-comment-form' var='post'/>
<b:includable id='threaded_comment_js' var='post'/>
<b:includable id='threaded_comments' var='post'/>
</b:widget>
</b:section>
</div>


<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
</b:widget>
</b:section>
</div>

<div class='clear'>&#160;</div>

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div>

</body>
</html>







Related Post for Generic Blogger Template

  • IMAGE UPLOAD WITH JAVA WITH PHP CODE ------------------------------------------------------------------------------------------------------ CREATE FOLDER AND CREATE AND SAVE FILES ONE BY ONE IN THIS FOLDER &nb…
  • SCREEN TO GIF ------------------------------------------------------------------------------------------------------------------ Read More:  3:30 PDF HTML IMAGE CONVERTER HD…
  • MEMORY GAME WITH UPPER HIDDEN CARD -------------------------------------------------------------------------------------------------------------- Other Games http://www.internet4classrooms.com/skill_builders/s…
  • IMAGE SRC ARRAY IN JAVA SCRIPT --------------------------------------------------------------------------------------------------------------- CODE:1 http://fbgadgets.blogspot.co.uk/2017/07/java-script-arra…
  • BUTTON CHANGE INTO DROPDOWN MENU ----------------------------------------------------------------------------------------------------------------- DIV TAG DROPDOWN MENU https://www.youtube.com/watc…
  • NOTE PAD ++ SYNTAX HIGHLIGHTER FOR BLOGGER POST --------------------------------------------------------------------------------------------------------------------- NOTE PAD ++ SYNTAX HIGHLIGHTER FOR BLOGGER POST https://…
  • IMAGE UPLOAD WITH JAVA WITHOUT PHP CODE ------------------------------------------------------------------------------------------------------ COPY AND PASTE BELOW CODE IN NOTE PAD AND SAVE IN HTML FILE -----------…
  • CSS SYNTAX HIGHLIGHT CHANGE IN NOTEPAD++ SYNTAX HIGHLIGHTER ------------------------------------------------------------------------------------------------------------------- SYNTAX HIGHLIGHTER LINKS -----------------------------------…
  • NOTEPAD++ REMOVE UNWANTED LINES ------------------------------------------------------------------------------------------------------------------------------------------------------------ STEP NO : 1 1- CT…
  • QUIZY MEMORY CARD GAME ---------------------------------------------------------------------------------------------------------- READ MORE: http://memorygame.quizyplugin.com https://holifestival.de/…
Posted by on Sunday, 16 October 2016 at 11:43
Labels: , , , , , , , ,

0 comments:

Post a Comment

:) :)) ;(( :-) =)) ;( ;-( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ $-) (b) (f) x-) (k) (h) (c) cheer
Click to see the code!
To insert emoticon you must added at least one space before the code.

Subscribe to: Post Comments (Atom)
FB Gadgets | Template Designed by Fatakat PhotosCoolBThemes.com
Code by : paid web directory

https://www.google.co.uk/search?q=site%3Ablogspot.com+fbgadgets