Tampilkan postingan dengan label tips/tricks blog. Tampilkan semua postingan
Tampilkan postingan dengan label tips/tricks blog. Tampilkan semua postingan

Home » Posts filed under tips/tricks blog

cara membuat efek zoom pada gambar di blog

Diposting oleh Alfianto Nandya Prakoso on Sabtu, 27 Agustus 2011


Pada dasarnya membuat efek zoom pada gambar cukup banyak manfaatnya, selain menghemat tempat, sekaligus mempercantik tampilan blog kita. Ada kalanya dimana kita mempunyai gambar yang sangat besar dan harus di tampilkan dalam ukuran yang besar, wah tempatnya ga cukup nih mas, itu bisa menjadi kendala dalam optimasi gambar yang hendak ditampilkan. Sementara sobat tidak ingin gambar tersebut berlalu begitu saja tanpa sentuhan pengunjung sedikitpun.

Tutorial membuat efek zoom pada gambar ini sangat mudah, cukup menambahkan kode css padatemplate dan sedikit mengedit kode gambar yang sobat miliki. Ga usah panjang lebar ya, langsung praktek aja. Sip, sekarang silahkan siapkan komputer sobat dulu, plus kopi dan rokok sebagai pelengkap..Hot

  1. Silahkan login ke Blogger terlebih dahulu.

  2. Kemudian klik Tata Letak.

  3. Tuju halaman Edit HTML.

  4. Letakkan kode css berikut ini, tepat diatas / sebelum kode ]]></b:skin>

    /* Zoom Efek */
    .thumbnail{position:relative;z-index:0}
    .thumbnail:hover{background-color:transparent;z-index:50}
    .thumbnail span{position:absolute;left:-1000px;visibility:hidden;color: black;text-decoration: none}
    .thumbnail span img{border-width:0;padding:2px}
    .thumbnail:hover span {visibility: visible;top: 0;left: 60px}

  5. Jangan lupa Simpan Template.

## Untuk membuat gambarnya zoom-nya, berikut contoh gambar yang saya punya :

<a href="http://s643.photobucket.com/albums/uu155/miskahiper/?action=view&current=vaio-zoom-1.jpg" target="_blank"><img src="http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg" border="0" alt="Photobucket"></a>

Kemudian hapus tulisan yang berwarna hijau, tambahkan dengan tulisan yang berwarna merah, sehingga menjadi seperti berikut :

<a class="thumbnail" href="#thumb"><img src="http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg" border="0" alt="Photobucket"><span><img src="http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg"width="380px" height="300px";/></span></a>

coba sekarang sobat sorot gambar dibawah ini 

Photobucket


Sedangkan kode HTMl untuk text adalah sebagai berikut :

<a class="thumbnail" href="#thumb">Contoh Gambar<span><img src=http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg /></span></a>

coba di sorot tulisan berwarna hijau dibawah ini :

Contoh Gambar

Ukuran besarnya gambar yang akan di zoom silahkan sobat atur sesuai keinginan, silahkan gantiangka yang berkelip yang berwarna merah dengan ukuran yang sobat inginkan saat di zoom, sesuaikan juga dengan ukuran asli gambar agar gambar yang di zoom tidak pecah atau kabur. Oke sob, selamat mencoba ya, semoga berhasil !Thumbs-up
Read More
di 21.15
Label:

blog anti jiplak

Diposting oleh Alfianto Nandya Prakoso on Jumat, 26 Agustus 2011


sesuai triks kali ini, saya membuat hanya untuk sharing ilmu yang berhubunggan dengan blog. untuk anda atau siapa saja tidak usah sungkan-sungkan untuk melakukan copy paste pada blog saya, tanpa harus melakukan pengeditan terlebih dahulu, Boleh juga tanpa harus menyebutkan sumber (link).
tapi bukan berarti saya mendukung aksi dari pengcopy paste-an tersebut.
apakah anda tertarik untuk melakukan triks kali ini!!

langsung aja :
1. pertama login terlebih dahulu
2. masuk ke tata letak >> edit HTML
3. jangan lupa memberi tanda centang pada Expand Template Widget
4. copy paste code berikut dan letakkan codenya diatas <head>
<script type="text/javascript">
if (typeof document.onselectstart!="undefined") {
document.onselectstart=new Function ("return false");
}
else{
document.onmousedown=new Function ("return false");
document.onmouseup=new Function ("return true");
}
</script>

5. kemudian simpan template , selesai
lihat hasilnya . .
Read More
di 03.54
Label:

menambah musik atau lagu di blog

Diposting oleh Alfianto Nandya Prakoso


Langsung aja .
Gak pake Basa Basi .
Login Blog Anda terlebih dahulu .
Pada bagian dasbor Pilih Rancangan > Elemen Laman
Tambah Gedget > HTML/JavaScript
Masukkan kode berikut :


<center><embed src="http://img227.imageshack.us/img227/3087/playergv1.swf?soundFile=http://www60.indowebster.com/7d687569a0b19d75aa5ab1fd2ce5fa3f.mp3&amp;bg=0x000000&amp;leftbg=0x000000&amp;lefticon=0xFFFFFF&amp;rightbg=0x333333&amp;rightbghover=0x333333&amp;righticon=0xCCCCCC&amp;righticonhover=0xFFFFFF&amp;text=0xcccccc&amp;slider=0x666666&amp;track=0xFFFFFF&amp;border=0xFFFFFF&amp;loader=0xcccccc&amp;autostart=yes&amp;loop=yes" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" width="290" height="24"></embed></center>
Keterangan : Pada code Merah anda bisa ganti dengan Alamat File lagu yang akan anda masukan kedalam blog anda .

Simpan .

Oke segitu dulu dari saya 
jangan lupa komentar nya .
:D
Read More
di 03.39
Label:

Diposting oleh Alfianto Nandya Prakoso

Saya yakin, Anda pasti bosan dengan cursor berbentuk panah itu. Dengan trik kali ini, Anda bisa mengganti cursor panah tersebut dengan gambar-gambar yang menarik setiap kali blog Anda dibuka. Caranya pun sangat mudah.

Langsung saja, begini caranya:

1. Pilih tab “Tata Letak”.
2. Klik “tambah gadget” baik itu berada di bawah, atas atau samping.
3. Pilih “HTML/JavaScript”
4. Copy kode di bawah ini pada tempat pengetikan:


<style type="text/css">
HTML,BODY{cursor: url("http://downloads.totallyfreecursors.com/cursor_files/rainbow-ani.ani"), url("http://downloads.totallyfreecursors.com/thumbnails/rainbow-ani.gif"), auto;}
</style>



Read More
di 03.33
Label:

12 things wrong about blogger platform

Diposting oleh Alfianto Nandya Prakoso on Sabtu, 13 Agustus 2011


Below I try to summarize some of the questions that I think is unique and sometimes asked directly to me via email or via a message on Facebook and unique among the questions that go usually also frequently debated by most Blogger users. Here I tried to attempt to straighten out the debate that might have been mistaken in my opinion. Remember! I’m just trying to straighten not justify :)
1. Blogger does not support GZip compression?
False, by default we use bloggers who already support high-level technique with gzip compression, so why should we think to do it, Forget these compression techniques, let alone bloggers who perform their duties. still not sure? Just check blogger custom domain or blogspot with this tool Gidnetwork, Digital Coding dan GZip Test
2. CSS, Image, and Javascript does not need to be compressed again?
False, though Blogger supports gzip compression only on the server side rather than on the client side, I still meyarankan we keep doing the compression on Css, Image and Javacsript manually. Please Use the tools Css Compressor,  Javascript Compressor and Image Optimization with Yahoo! Smushit.com
3. External CSS  is faster than CSS internal?
False, Blogger itself will be faster with Css Internal, External Css although in fact preferred by a non blogger platform. Internal Css deficiency is only one measure of the swelling capacity (size) on the size of the page.
4. Blogger SERP is still far behind the other platforms?
False, SEO techniques on any blog platform that is nearly equal dwell only on about the Meta title, Meta keywords and Meta description. SERP strength only depends on the number of backlinks and keyword density on a page and not on its platform.
5. SERP with Custom Domains nicer than the standard Blogspot?
False, there is no connection at all. (reread the above points)
6. Meta Title and Meta Description Internal nicer than the default title and description in a Widget?
False, and very little influence, why most of us (bloggers) prefer internal Meta tags? another simply because it’s not easy customization issues.
7. Too many upload images will be banned?
False, by default the image we upload to the bloggers will be saved automatically in Google’s Picassa database, even if too many pictures uploaded, it will only reduce our storage capacity. Remember the storage capacity of a single account at Google we are only limited to about 1024MB. Read more or check directly how much storage capacity that can still use this addressed ManageStorage
8. Blogger is not allowed to porn sites or adult related?
I still hesitate to answer as well, there are some blogs that blatantly made ​​for the purpose of pornography and it’s not a problem, if indeed there should not be to what the “Adult Content?” the settings (settings). Perhaps that should not be, is a certain Sara, Child Pornography, Religion and etc.. Please read the TOS rule bloggers here
9. Blogger does not support Adsense for Indonesian?
True, but can also be False. Google Adsense can still be rigged in order to perform the Indonesian language and posted on several blogs that I have seen so far is safe to use the technique of “cheating” is. But I do not recommend this way and should be avoided.
10. Blogger (blogspot) is still acceptable for registration Adsense?
False, Google is no longer accept registration using your account without using TLD or Blogspot Custom Domain. So you should use Blogger Custom Domains was before Adsense list.
11.Blogger Custom domain without the TLD or can not be fitted Adsense Code?
False, Google Adsense can still be installed on blogspot without a custom domain, which is not accepted at this time only the time of registration only. My advice, please continue to follow developments and changes in Google Adsense TOS maybe just my current opinion is no longer valid.
12. Removing Navigation Bar (NavBar) will be banned?
Still doubtful, but I think Blogger is not so stupid and so mean, they really need us (blogger users) to advertise all of their advertising products. Although Google is very selective when it is nothing to keep their good name in the eyes of the Advertiser. so, it’s up to us right now what not .. mo eliminated all the risks borne by yourself :)
Ok! So much may be used. All input and my answer above may be wrong and not all true. All changes may have occurred while I was writing this, or maybe even any other new rules .. who’s know?
Anyone want to add? Please discuss with us in the comment:)
Read More
di 02.15
Label:

Sell Products Online with e-Junkie (+COUPON CODE)

Diposting oleh Alfianto Nandya Prakoso


Think of it this time we’ve created a product that is ready for sale online, whether it may be physical or digital product, can be e-Book, Shirt, Video Tutorials or Template Premium, but you still wonder what had to sell it to use the service. Maybe this article will answer the question associates all how easy it is to sell our products online using E-Junkie, without complicated scripts to provide specifically for selling the site and all products to be sold can be done only with a capital Blogger alone.
As we know, many service providers Shoping Card like Click Bank, 1ShoppingCart, PayDotCom etc.. But this time I only explained using e-junkie, because I also use it to sell templale in premium.zoomtemplate.com. E-junkie himself sebenanya can be regarded as intermediary services online sales because they are already integrated by many standards such as the PayPal payment service, PayPal Pro, Google Checkout, Authorize.Net, 2CheckOut, ClickBank and TrialPay.
Many advantages offered by e-jankie when compared with other card shopping service provider. Although essentially all alike providing facilities Button Buy Now and Shopping Card. With e-junkie we can easily do a simple setup, add products, edit it and copy and paste the html code buy button anywhere on our site.
Each buyer completed payment on one of the products we sell, it will automatically be sent a download link directly to email the buyer. Another plus we can also secure the download link with the time constraints tertertu, or just how many times the link may be downloaded, mingkin is one of the best ways to secure the download link in order not to be misused by the buyer that “rogue”. E-junkie reseller also provides a product (affiliate), so anyone can resell our products to the commission that we have set previously.
Unfortunately, the e-junkie is not free, they provide the cheapest price starts from $ 5 / Month with a storage capacity 50BM. of course this is fairly cheap if the products we sell are sold:) Do not worry for the registration is still free for 7 days to really we could try.
Read More
di 02.13
Label:

All Feature in Blogger Stats

Diposting oleh Alfianto Nandya Prakoso

Simple graphical display but it is comfortable to use, that’s my first impression when trying a new feature from Blogger Statistics. Of the many features that have been planted into Blogger, only this time I felt it was complete. If previously I had to log back and forth to Google Analytics, this time because they all look more simple majority of the important features of Google Analytics is built into the Blogger feature statistics that we can see straight through the dashboard page. oh yes .. to be able to try this feature because it is still in the testing phase, then the peer can access them through the pages of Blogger In Draft.
Let more easily learn all the features, here I try to describe one by one:
1. Blogger Stats Overview
This feature allows us to see the statistics of the number of visits globally. With the statistics display is divided into 4 sections, we as admin of course made easier to analyze traffic in real time, view and analyze visitor interest from anywhere our blog visitors come from. For more specific we can choose the time available penanyang be some tabs, it can be in days, weeks, months or the total time.
2.  Statistics for Blogger Post
Not need to be explained at length to post statistics, we would have understood the intent of these publishers, we can see a direct short post or article where the most demanding visitors. Well if you want to analyze more observant, post statistics with the greatest value not only because it contains an interesting article or post is newly published, but is also targeting the keyword corresponding large berpengarur lho:) more Kren again if a special blog for the buy-sell, of course, we can easily mengalisa what items are most sought-after buyer:)
3.  Blogger Traffic Sources
How do visitors find our blog? kujungan is where all traffic is recorded and displayed into the form of reports. There are 3 parts that we can anlisa ie, can be through Referring URLs, Referring Sites and Keyword Search.
4. Blogger Stats For Audience Statistics
Very interesting if we could easily mengalisa from the end of any country we come from, Web Browser and OS are the most widely used to display the pages of our blog. Remember the visitor is king, of course we hope to give the best service for them.
One thing I think something is missing or is deliberately not shown, why bloggers only displays statistics for the number of pageviews without displaying the number of visitors? or is directly summed with the number of visitor statistics into pageviews. well who knows … awaited further news … :)
Read More
di 02.11
Label:

Creating Bubble ToolTips 100% Uses CSS

Diposting oleh Alfianto Nandya Prakoso


Bubble Tool Tips are useful to provide information about a link (could refferal link so many people that follow). If it is moved over the link (hover) it automatically bubble tool tips will come out with all the information is written. Usually to make a balloon tip is some people call the javascript which will overload the blog with a very large size. Well this is the trick that uses pure CSS as the calling code. To see a live preview please just click this link .

This trick uses CSS, and here it is code:
/*———- balon tips ———–*/
a.bt{
position:relative;
z-index:24;
color:#3CA3FF;
font-weight:bold;
text-decoration:none;
}
a.bt span{ display: none; }
/*background:; ie hack, harus mengubah sesuatu untuk menampilkan di IE*/
a.bt:hover{ z-index:25; color: #aaaaff; background:;}
a.bt:hover span.balontips{
display:block;
position:absolute;
top:0px; left:0;
padding: 15px 0 0 0;
width:200px;
color: #993300;
text-align: center;
filter: alpha(opacity:90);
KHTMLOpacity: 0.90;
MozOpacity: 0.90;
opacity: 0.90;
}
a.bt:hover span.atas{
display: block;
padding: 30px 8px 0;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFVyAWiV4ZN06gI1dgLcWFVrhO6rHSronPUkKsldzRR8jkKV-Ssi-03TTC3xE7Qyw63UIPEPOmP8K6obRreUOX0_11AZ-jAqRoTjQSbko3-dd1TE_UChzvx_OdUN5e137d4W0ebMhjj1Y/) no-repeat top;
}
a.bt:hover span.tengah{
display: block;
padding: 0 8px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyD3plgainbRgeN92bJ3Ubz2oVznwjG6_GxernSNS9jWUKqIH9CS4-aGBzx0ipIAwYqZBghuEWA7yu_Mh3VMdbXzl9jSzJ8FN5iQJ8Mzx8KBoxD3iTbqDJmIftNxMnKoOAuUpVzc3cv-s/) repeat bottom;
}
a.bt:hover span.bawah{
display: block;
padding:3px 8px 10px;
color: #548912;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFVyAWiV4ZN06gI1dgLcWFVrhO6rHSronPUkKsldzRR8jkKV-Ssi-03TTC3xE7Qyw63UIPEPOmP8K6obRreUOX0_11AZ-jAqRoTjQSbko3-dd1TE_UChzvx_OdUN5e137d4W0ebMhjj1Y/) no-repeat bottom;
}
/*———- balon tips END———–*/
How to To use:
1. Links that have been made ​​in the given declaration class = “bt”.
The links in HTML code looks like this <a href=”http://dindingcoret.com”></a> Once given the declaration would be like this: <a href=”http://dindingcoret.com”></a>
2. Declare balontips. Call balontips by writing code <span=”balontips”></span>. Enter a link between the code.
3. Call the image above by typing <span=”atas”></span>. Enter the code between “balontips”.
4. Call the center of the image by typing <span=”tengah”></span>. Enter the code between “balontips” under the code “above”. This place pal pal write comments.
5. Call the image below by typing <span=”bawah”></span>. Enter the code between “balontips” under the code “middle”.
Example code can be found here:
<a href=”URL SOBAT“>
Title here..
<span>
<span>
</span>
<span>
Description here..
</span>
<span>
</span>
</span>
</a>
Read More
di 02.02
Label: