Showing posts with label BLOGGER TUTORIAL. Show all posts
Showing posts with label BLOGGER TUTORIAL. Show all posts

Thursday, November 11, 2010

Trik Agar Blogger Anda Diakses Cepat Via Ponsel

Ini dia trik agar pengunjung mengakses blog Anda dengan cepat:

Login ke akun Blogger Anda> Rancangan> Edit html
Cari kode semacam ini:
<b:include data='blog' name='all-head-content'/>

Paste kode berikut di bawah kode itu...
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width, initial-scale=1.0, user-scalable=0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
Simpan Perubahan.

Sumber: http://bongkarrahasia.blogspot.com/

Monday, August 16, 2010

Tips Membuat Tampilan Mobile Blogspot yang Dapat Dikomentari

Ada dua situs layanan terbaik yang dapat membuat tampilan blogspot Anda terredirect otomatis ke tampilan mobile bila diakses dengan ponsel, yakni http://mobify.me dan http://bloggertouch.sopili.net.

Kelebihannya, blog Anda dapat dikomentari, karena diberikan link menuju halaman

Thursday, August 20, 2009

Three Columns Thisaway Template

/* global
-------------- */
body {
margin: 0;
text-align: center;
min-width: 760px;
background: #ce436e url(http://www.blogblog.com/thisaway_rose/bg_body.gif) repeat-x left top;
color: $textColor;
font-size: small;
}

blockquote {
margin: 0;
padding: 0 10px 0 10px;
border-left: 6px solid #f7d8e2;
border-right: 6px solid #f7d8e2;
color: $postTitleColor;
}

code {
color: $postTitleColor;
}

hr {
display: none;
}

/* layout
-------------- */
#outer-wrapper {
margin: 0 auto;
width: 760px;
text-align: left;
font: $bodyFont;
}

#header-wrapper {
padding-bottom: 15px;
background: url(http://www.blogblog.com/thisaway_rose/bg_header_bottom.gif) no-repeat left bottom;
}

#header {
background: #632035 url(http://www.blogblog.com/thisaway_rose/bg_header.gif) repeat-x left bottom;
}

#content-wrapper {
position: relative;
width: 760px;
background: #f7f0e9 url(http://www.blogblog.com/thisaway_rose/bg_main_wrapper.gif) repeat-y left top;
}

#main-wrapper {
display: inline; /* fixes a strange ie margin bug */
float: left;
margin: 0 0 0 3px;
padding: 0;
width: 483px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#main {
padding: 22px 8px 0 8px;
background: url(http://www.blogblog.com/thisaway_rose/bg_content.gif) repeat-x left top;
}

.post {
margin: 0 8px 14px 21px;
padding: 0;
border-bottom: 3px solid #f7d8e2;
}

#comments {
margin: 0 16px 14px 29px;
padding: 10px;
border: 1px solid #f0ced8;
background-color: #f5e4e9;
}

#sidebar-wrapper {
display: inline; /* fixes a strange ie margin bug */
float: right;
margin: 0 3px 0 0;
width: 269px;
color: $textColor;
line-height: 1.4em;
font-size: 90%;
background: url(http://www.blogblog.com/thisaway_rose/bg_sidebar.gif) repeat-x left top;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar {
padding: 7px 11px 0 14px;
background: url(http://www.blogblog.com/thisaway_rose/bg_sidebar_arrow.gif) repeat-y 179px 0;
}

#sidebar .widget {
margin-bottom: 20px;
}

#footer-wrapper {
padding-top: 15px;
background: url(http://www.blogblog.com/thisaway_rose/bg_footer_top.gif) no-repeat left top;
clear: both;
}

#footer {
background: #491525 url(http://www.blogblog.com/thisaway_rose/bg_footer.gif) repeat-x left top;
text-align: center;
min-height: 2em;
}


Change, amend or insert the portions (shown in red):-
 
/* global
-------------- */
body {
margin: 0;
text-align: center;
min-width: 987px;
background: #ce436e url(http://www.blogblog.com/thisaway_rose/bg_body.gif) repeat-x left top;
color: $textColor;
font-size: small;
}

blockquote {
margin: 0;
padding: 0 10px 0 10px;
border-left: 6px solid #f7d8e2;
border-right: 6px solid #f7d8e2;
color: $postTitleColor;
}

code {
color: $postTitleColor;
}

hr {
display: none;
}

/* layout
-------------- */
#outer-wrapper {
margin: 0 auto;
width: 987px;
text-align: left;
font: $bodyFont;
}

#header-wrapper {
padding-bottom: 15px;
background: url(http://i191.photobucket.com/albums/z76/tipsfornewbloggers/tyr/bg_header_bottom_2.gif) no-repeat left bottom;
}

#header {
background: #632035 url(http://www.blogblog.com/thisaway_rose/bg_header.gif) repeat-x left bottom;
}

#content-wrapper {
position: relative;
width: 987px;
background: #f7f0e9 url(http://i191.photobucket.com/albums/z76/tipsfornewbloggers/tyr/bg_main_wrapper_2.gif) repeat-y left top;
}

#main-wrapper {
display: inline; /* fixes a strange ie margin bug */
float: left;
margin: 0 0 0 3px;
padding: 0;
width: 483px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#main {
padding: 22px 8px 0 8px;
background: url(http://www.blogblog.com/thisaway_rose/bg_content.gif) repeat-x left top;
}

.post {
margin: 0 8px 14px 21px;
padding: 0;
border-bottom: 3px solid #f7d8e2;
}

#comments {
margin: 0 16px 14px 29px;
padding: 10px;
border: 1px solid #f0ced8;
background-color: #f5e4e9;
}

#sidebar-wrapper {
display: inline; /* fixes a strange ie margin bug */
float: right;
margin: 0 3px 0 0;
width: 247px;
color: $textColor;
line-height: 1.4em;
font-size: 90%;
background: url(http://www.blogblog.com/thisaway_rose/bg_sidebar.gif) repeat-x left top;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar {
padding: 7px 11px 0 14px;
background: url(http://www.blogblog.com/thisaway_rose/bg_sidebar_arrow.gif) repeat-y 159px 0;
}

#sidebar .widget {
margin-bottom: 20px;
}

#newsidebar-wrapper {
display: inline; /* fixes a strange ie margin bug */
float: left;
margin: 0 0 0 3px;
width: 247px;
color: $textColor;
line-height: 1.4em;
font-size: 90%;
background: url(http://www.blogblog.com/thisaway_rose/bg_sidebar.gif) repeat-x left top;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#newsidebar {
padding: 7px 11px 0 14px;
background: url(http://www.blogblog.com/thisaway_rose/bg_sidebar_arrow.gif) repeat-y 159px 0;
}

#newsidebar .widget {
margin-bottom: 20px;
}

#footer-wrapper {
padding-top: 15px;
background: url(http://i191.photobucket.com/albums/z76/tipsfornewbloggers/tyr/bg_footer_top_2.gif) no-repeat left top;
clear: both;
}

#footer {
background: #491525 url(http://www.blogblog.com/thisaway_rose/bg_footer.gif) repeat-x left top;
text-align: center;
min-height: 2em;
}


We have done up new background images to accommodate the new widths. The widths of the sidebars are slightly reduced.

Scroll down to these lines:-

/** Page structure tweaks for layout editor wireframe */

body#layout #main,
body#layout #sidebar {
padding: 0;
}


Change them to this:-

/** Page structure tweaks for layout editor wireframe */

body#layout #main,
body#layout #sidebar,
body#layout #newsidebar {
padding: 0;
}


Further down the template, look for this and add the lines (shown in red):-














This places your Profile in the left sidebar. This can be removed later. Now, “Preview” the template to view the changes and if see the new sidebar nicely aligned, click “Save Template”. Remove the Profile if you don't want it there by going back to Template -> Page Elements and removing the Profile widget. Refresh your Blog to see your new Three Column Thisaway Rose layout!

Align Header Title and Description

The Header title and description in the Thisaway Green and Thisaway Rose templates are aligned to the left. To adjust them to the center or a fixed position in the Header, read the guidelines at Header Image and Title Alignment (II).

© Tips for New Bloggers