Postingan Terbaru Copy dan Edit ( CO-DIT )

Berikut ini merupakan beberapa postingan yang sudah ada deblog Copy dan Edit selahkan dibaca satu persatu kalaw sekiranya bermanfaat, tapi semoga postingan-postingan ini bermanfaat amin.

Membuat Halaman Blog Penuh

Copy & Edit - Membuat Halaman Blog Penuh | Tutuorial Membuat Halaman Blog Penuh | Cara Membuat Halaman Blog Penuh | Mudah Membuat Halaman Blog Penuh, Pada kesempatan kali ini CO-DIT akan memberikan cara yang paling ampuh Membuat Halaman Blog Penuh maksud dari kata-kata penuh yaitu tanpa gadget disidebar artinya blog tersebut cuma berisi postingan saja.

Copy & Edit Berikut cara Membuat Halaman Blog Penuh silahkan dibaca caranya Membuat Halaman Blog Penuh di bawah ini :

Login ke blogger
Pilih Rancangan >>> Elemen Halaman >>> Edit HTML
Silahkan cari kode </head>
Jika sudah ketemu, silahkan letakkan kode dibawah ini tepat diatasnya kode tersebut

<b:if cond='data:blog.pageType == "item"'>
<style>
#sidebar-wrapper {display:none;}
#main-wrapper { width: 900px; float: left;}
</style>

Perhatikan :
Kode warna hijau adalah kode yang berhungan dengan sidebar blog bahkan sobat juga dapat menghilangkan header blog ataupun footer blog, kode warna biru adalah kode halaman postingan. Warna merah adalah lebarnya, silahkan ganti lebarnya sesuai denan template sobat

Jika sudah, simpan template dan lihat hasilnya

Kira-kira begitulah Membuat Halaman Blog Penuh semoga bermanfat

1 Comment

Label: BLOG TINGKAT MENENGAH, DESAIN BLOG

Merubah Background Postingan


COPY & EDIT - Merubah background Postingan, inilah yang akan menjadi bahan postingan
COPY & EDIT pada kesempatan kali ini, oke sebelumnya kenalkan dulu atau pilih dulu
backgroun yang ingin digunakan antara lain :





http://s600.photobucket.com/albums/tt81/adyirwan_bucket/?action=view&current=pre_code_bg_ylwgif.png


http://i600.photobucket.com/albums/tt81/adyirwan_bucket/pre_code_bggif.png


http://i600.photobucket.com/albums/tt81/adyirwan_bucket/pre_code_bg_blkgif.png
bagaiman cara mengapplikasikan?? mudah sekali dengan 2 langkah maka Background Postingan
sobat akan berubah
Login ke blogger.com dengan akun sobat
masuk ke Rancangan => Edit HTML
cari kode ]]></b:skin> dengan cara tekan dan tahan Ctrl + F lalu tulis kode ]]></b:skin> setalah itubkopi kode ini dan paste diatar kode ]]></b:skin> tadi
setelah selesai jangan lupa disimpan, ini kodenya 
/*--http://adie-konoe.blogspot.com Script--*/
pre {
font-size: 12px;
padding: 0;
margin: 0;
background: #f0f0f0;
border-left: 1px solid #ccc;
border-bottom: 1px solid #ccc;
line-height: 20px; /*--Height of each line of code--*/
background: url(http://i600.photobucket.com/albums/tt81/adyirwan_bucket/pre_code_bggif.png) repeat-y left top; /*--Background of lined paper--*/
width: 600px;
overflow: auto; /*--If the Code exceeds the width, a scrolling is available--*/
overflow-Y: hidden; /*--Hides vertical scroll created by IE--*/
}
pre code {
margin: 0 0 0 40px; /*--Left Margin--*/
padding: 18px 0;
display: block;
}
<={ CATATAN }=>
Kode yang berwarna merah tebal di atas rubah sesuai dengan selera sobat apabila suka dengan
gambar 3 diatas dibawahnya itu adalah alamatnya...
Cara pertama sudah selesai sekarang tinggal cara terahir yaitu ketika mau posting taru kode ini
sebelum dan sesudah postingan sobat ini dia kodenya.
<pre><code>
POSTINGAN SOBAT
</code></pre>

Add Comment

Label: BLOG TINGKAT MENENGAH, DESAIN BLOG, MENGENAI POSTINGAN

3 Langkah Membuat Navigasi Menu Keren di Blog

CO-DIT - 3 Langkah

Membuat

navigasi menu keren di Blog

- pada tutorial kali ini yaitu tentang mepercantik blog kita yang akan kita bahas yaitu tutorial mempercantik blog yaitu cuma

3 Langkah

Membuat navigasi menu keren di Blog,

untuk lebih jellasnya silahkan lihat dulu disini

Cara membuatnya mudah banget ikuti langkah2 nya sampai selesai karena kalaw tidak maka tidak akan selesai juga.............. :

Rancangan, Edit Html,

download dulu template anda untuk jaga2

Cari kode ]]></b:skin>

Dan taruh ( sabe' ) kode berikut diatasnya kode ]]></b:skin> tadi, ne kodenya :

/*----------------
Beautiful Slide Out Navigation
-------------------------------*/
.headerfixed
{
width:800px;
height:56px;
position:absolute;
top:50%;
left:10px;
background:#fff url(title.png) no-repeat top left;
}
ul#navixed {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 10px;
list-style: none;
z-index:999999;
width:1000px;
}
ul#navixed li {
width: 103px;
display:inline;
float:left;
}
ul#navixed li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#000;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
ul#navixed li a:hover{
background-color:#000;
}
ul#navixed li a span{
letter-spacing:2px;
font-size:11px;
color:#FFF;

}
ul#navixed .home a{
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-allfile.png);
}
ul#navixed .about a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-facebookicon.png);
}
ul#navixed .search a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-blogger.png);
}
ul#navixed .podcasts a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-makalah.png);
}
ul#navixed .rssfeed a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-agamaislam.png);
}
ul#navixed .photos a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-software.png);
}
ul#navixed .contact a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-seo.png);
}
ul#navixed .computer a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-computer.png);
}
ul#navixed .photo a {
background-image: url(http://i1094.photobucket.com/albums/i454/rikiyanto1/kapak-comunity-photoshop.png);

6. taruh kode2 ini tepat bgt diatasnya kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'/> <script src='http://kangdadang.googlecode.com/files/jcolor.js'/><script type='text/javascript'> $(function() { var d=300; $('#navixed a').each(function(){ $(this).stop().animate({ 'marginTop':'-80px' },d+=150); }); $('#navixed > li').hover( function () { $('a',$(this)).stop().animate({ 'marginTop':'-2px' },200); }, function () { $('a',$(this)).stop().animate({ 'marginTop':'-80px' },200); } ); }); </script>

7. terahir letakkan kode berikut ini tepat dia atasnya kode <body>

<ul id='navixed'>
<li class='home'><a href='http://kapakcomunity.blogspot.com/search/label/INFORMASI'><span>All File</span></a></li>
<li class='about'><a href='http://kapakcomunity.blogspot.com/search/label/FACEBOOK'><span>Facebook</span></a></li>
<li class='search'><a href='http://kapakcomunity.blogspot.com/search/label/BLOGGER'><span>Blogger</span></a></li>
<li class='photos'><a href='http://kapakcomunity.blogspot.com/search/label/SOFTWERE'><span>Software</span></a></li>
<li class='rssfeed'><a href='http://kapakcomunity.blogspot.com/search/label/PELAJARAN%20AGAMA'><span>Agama</span></a></li>
<li class='podcasts'><a href='http://kapakcomunity.blogspot.com/search/label/MAKALAH'><span>Makalah</span></a></li>
<li class='contact'><a href='http://kapakcomunity.blogspot.com/search/label/SEO'><span>SEO</span></a></li>
<li class='computer'><a href='http://kapakcomunity.blogspot.com/search/label/KOMPUTER'><span>Computer</span></a></li>
<li class='photo'><a href='http://kapakcomunity.blogspot.com/search/label/EDITING%20PHOTO'><span>Editing Photo</span></a></li>
</ul>

keterangan warna :

warna : kode yang harus di cari
warna : rubah sesuai template blog sobat
warna : link gambar sobat ganti sesuai keinginan
warna : judul
warna : link yang nantinya akan digunakan saat di klik

oke karena mata saya sudah tinggal 5 Watt lagi maka saya cukupkan tutorial 3 Langkah Membuat navigasi menu keren di Blog semoga sukses dan bisa bermanfaat buat anda.....

8 Comments

Label: BLOG TINGKAT MENENGAH, DESAIN BLOG

Mudahnya Memberikan Artikel Terkain di Blogspot

Ok g usah basa basi lagi langsung ikuti langh-langkahnya dibawah ini...........

inilah skrin shootnya

1. Login ke blogger.
2. Klik Layout lalu pilih Edit HTML
3. Untuk keamanan sebelum mengedit template backup terlebih dahulu templete anda. Dan klik Download Full Template.
4. Centang Expand Widget Templates
5. Cari kode <data:post.body>

6. Copy kode dibawah ini letakkan dibawah <data:post.body>

<b:if cond=’data:blog.pageType == “item”‘>
<div class=’similiar’>
<span class=’box’>
<div class=’widget-content’>
<h3>Artikel Terkait</h3>
<div id=’data2007′/><br/><br/>
<script type=’text/javascript’>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 6;
maxNumberOfLabels = 100;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", "
");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values=’data:posts’ var=’post’>
<b:loop values=’data:post.labels’ var=’label’>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</span></div>
</b:if>

7. Cari kode ini : ]]></b:skin>

8. Copy kode di bawah ini dan paste di atas kode ]]></b:skin>

.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}

Add Comment

Label: BLOG TINGKAT MENENGAH, DESAIN BLOG

COPY dan EDIT

Postingan Terbaru Copy dan Edit ( CO-DIT )

Berikut ini merupakan beberapa postingan yang sudah ada deblog Copy dan Edit selahkan dibaca satu persatu kalaw sekiranya bermanfaat, tapi semoga postingan-postingan ini bermanfaat amin.

Membuat Halaman Blog Penuh

Merubah Background Postingan

3 Langkah Membuat Navigasi Menu Keren di Blog

Mudahnya Memberikan Artikel Terkain di Blogspot

Cari Blog Ini

Artikel Populer

Statistik