Web page Maker v3.21

Akhirnya bisa juga nyempatin buat postingan yang sangat sederhana ini, karena beberapa hari ini alhamdulillah masih di berikan kesibukan offline yang benar-benar menyakitkan pinggang ini,hehee, kali ini ingin sedikit berbagi perangkat lunak yaitu Web page Maker, software yang satu ini mungkin bisa sangat membantu bagi teman-teman yang ingin belajar membuat website sederhana atau personal web dengan mudah, untuk penggunaannya software ini mudah dimengerti khususnya untuk kalangan yang masih awam dalam bahasa pemograman web seperti saya.

Selain itu web page maker juga menyediakan beberapa template untuk membantu pengguna dalam memulai pembangunan website yang sesuai dengan keinginan. Gambar berikut ini adalah tampilan sederhana yang saya buat menggunakan web page maker, maaf hasilnya tidak terlalu menarik dan masih berupa gambar soalnya belum sempat upload ke web hosting.

Gimana jelek kan, hehe ya sudah langsung aja bagi yang berminat langsung di download aj softwarenya, selamat belajar dan selamat berkreasi.

Download :: Web page Maker v3.21

Penting...!!! Bila ada link yang rusak harap informasikan ke saya.
Terima kasih...!!!

Read More..

Menu Navigasi CSS Mac Dock

Akhirnya kesampaian juga saya membuat postingan ini, bagaimana cara membuat Menu navigasi CSS Mac Dock mungkin menu navigasi yang satu ini sudah sering kita liat berkeliaran di internet dan bermacam metode cara pemasangannya, nah kali ini kita coba untuk membuatnya ya walau pun postingan saya kali ini aga telat dari pada yang lain mohon di maafkan :), ya udah dari pada basa-basi terus langsung saja kita buat berikut langkah-langkahnya. o.iya liat dulu demonya sebelum mencoba bagi yang belum tau, tapi bagi yang sudah tau langsung aja.

• Masuk ke Edit HTML cari code ]]></b:skin> lalu copas script di bawah ini di atas code tadi.

/* ---------------
http://www.amcied-logica.blogspot.com/
---------------------------------- */
.dock {
position: relative;
height: 50px;
text-align: center;
}
.dock-container {
position: absolute;
height: 50px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdOf2gR0Ze6sbgSdMu9I60wIASMuoIvyDv8tyUQq31qXXWw-nmLtkbc4erHuSTQM6HTdd1L3pCaxYN8g06GCk3lHUrNrwJwbyY1Wd4cOjuF0nwvVvZtSki8RtAl69jKa9Mvc3Vc-2rTEk/s1600/dock-bg2.gif);
padding-left: 20px;
}
a.dock-item {
display: block;
width: 40px;
color: #000;
position: absolute;
top: 0px;
text-align: center;
text-decoration: none;
font: bold 12px Arial, Helvetica, sans-serif;
}
.dock-item img {
border: none;
margin: 5px 10px 0px;
width: 100%;
}
.dock-item span {
display: none;
padding-left: 20px;
}

• Selanjutnya Copas lagi script dibawah ini, diatas code </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://amcied-logica2.googlecode.com/files/interface.js"></script>

• Lanjut lagi di bagian Body template, letakkan script di bawah ini, di atas </body>

<script type="text/javascript">
$(document).ready(
function()
{
$('#dock').Fisheye(
{
maxWidth: 50,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 40,
proximity: 90,
halign : 'center'
}
)
}
);
</script>

• Simpan templet, setelah itu copas lagi script di bawah ini dan letakkan dimana saja sesuai kesukaan teman-teman, disini saya meletakkannya di HTML/JavaScript sebagai contoh.

<div class="dock" id="dock">
<div class="dock-container">
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgj7rGLNK-3mZB0KSHILNCVxS2eqlONxt-cIHInDWxRdVqKArgGV3fkya0n4J4LRsZtt1xvyDKiO8RtJoMzM4h48E96DadXZho8c6pWDE0AT82RjtSByeNA0cKJXaB1GmJXYmr168HMnKs/s1600/home.png" alt="home" /><span>Home</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDnuHyAQa0ESEHMMXpPGp1iM2XCy510IRIyNmdSMxn3Obu9vgeSSfFnCZbEZ6my9cKO5hputGTqZgI4d7DsPY_-cK2JxtBarbXGW-1DCWK6jy0DYAiDeLxxdp0IHOPa8aAKl1ILRpZXbY/s1600/email.png" alt="contact" /><span>Contact</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkzNA-BDUOCkFCkAEOxsNyrtFW4mziOujHTjLdo8joz5fTuEBO_A3ngX2-OpSqtTKfElnLQTxtyp02ykKtGwb3BDVnG2alJ4owDrecfdRXik7mbgVmOBnFub5vQT2YvfYbRh9XEZdfSkc/s1600/portfolio.png" alt="portfolio" /><span>Portfolio</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKd0iuSDr54h5FvRCW_hYu8MSfNkYKO2xWoaK7yRfy-jrRFUj-97YoD7s0XGqw0fcdMNjurGqLzV8f2ZgvnkNW54BOKAgkopjQT-YeTGVWDc_6njx-14wUxfBSW-PBtwU_W_q0RFLwUr0/s1600/music.png" alt="music" /><span>Music</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhek3ZcsgH9FOcbR1-XpagVQR-oGI39s0o2SyJQ_4yGHaHYkr-fsEAu2IoAhL2XoispMeb-SqIaY-LSmploKHKS5XmqJ_jHBDLWHOWSZErBQCCpn_afcpqHrUCw5FDabu7ujGQOsn2ZFdM/s1600/video.png" alt="video" /><span>Video</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiijPJOoFVbzfA08EJymwvTwMqxO66gRLUHyylsgYO-XplmCjZ8BvLmshxQiHBOJ1qe4Irja4jo3HcStMZaT-mw7lchPYlyTEtu-hJGyOPJSRa3nl2RhJD0bjSz9-KJAf9W6Uz2s0t6ZhQ/s1600/history.png" alt="history" /><span>History</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU0KO2lysRLy8-mcGrPGpv-m9e1CxleufTpTvwWLCC7YaPjtU5OsdELEG71lRlD6nprMXA0GO8DbKw0iX9HlOx97qcA2SulFcaHIfZ_M3uRD_e4D9MVvIS7w2-7CiTPktey5iyByYV8q8/s1600/calendar.png" alt="calendar" /><span>Calendar</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy_6LvKpo2kMUAM_PrHM1ED2gFdfIGJJ1iZlA72YH6N6vckronU4dxhQJWICZgbiLzd92Srg-7TE0sb4FXMvMPlG0IGjYbOvaH_Bry5kW1PHC9OS-byW5E-hRfsmXWgw0KVvWbhZElj8E/s1600/rss.png" alt="rss" /><span>RSS</span></a>
<a class="dock-item" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXBWCZQSHBoCsVdfxu3nFFTYccnkvhPdZAR-sUCMKTqY6zJnaxItv7RHSv3eeOp759FgjBZrjQ0MQwjf81mPJr0WApj1Np4MVSZWQrPQ_LnKDOgVMUt2xOryJDevA8qYiWm8UAioOGxTg/s1600/rss2.png" alt="rss2" /><span>RSS2</span></a>
</div>
</div>

Selesai...!!! semoga bermanfaat.. :)

Read More..

Membersihkan Website dan Blog

Untuk postingan kali ini kita coba membahas bagai mana membersihkan website atau blog dari berbagai serangan baik itu virus atau orang-orang yang suka jahil dengan situs kita dengan menanam monitoring kedalam situs kita, mengapa saya membahas ini karena beberapa hari ini blog saya di jadikan remot monitoring oleh orang ketiga, jadi siapa saja yang membuka blog saya orang ketiga tersebut dapat melihat aktifitas komputer kita melalui browser mereka, kembali ke topik bagaimana mengatasinya berikut penjelasan lebih detailnya.

Kunjungi situs URL Void di situs ini teman-teman bisa membersihkan website atau web blog teman-teman dari bermacam virus yang tidak pernah kita ketahui virus apa saja yang ada di situs kita, sebaiknya teman-teman melukan scan di situs ini setiap hari tetapi jika teman-teman malas melakukannya, lakukan seminggu sekali saja. Maksud dari melakukan scan ini agar situs dan pengunjung situs kita komputernya tetap aman tidak terinfeksi oleh virus.

Selanjutnya instal AVG Toolbar sebenarnya plugins ini banyak sekali fungsinya salah satunya berfungsi membersihkan dan mendeteksi virus di situs yang ingin kita kunjungi, disini avg toolbar bukan hanya mendeteksi virus tapi juga mendeteksi kejahilan orang ketiga seperti yang saya alami, "peringatan yang di berikan, saya tidak dapat membuka situs saya tepapi jika ingin melajutkan membukanya, komputer terdeteksi monitoring pihak ketiga.

Albaloo adalah perangkat lunak scanner yang khusus untuk melakukan pembersihan pada website, fungsi software ini hampir sama dengan CCleaner, kalu CCleaner membersihkan isi komputer sedangkan Albaloo membersihkan website ke performa awal.

• Situs :: URL Void
• Software :: Albaloo

Semoga bermanfaat..!!!

Read More..

Membuat Multiple Target Link

Mungkin teman-teman sudah pasti mengenal script (Target="_Blank") yang berfungsi sebagai pembuka Tab baru, untuk kali ini kita coba membuat Multiple Target Link atau sering di sebut link yang membuka banyak tab, biasanya link ini di gunakan untuk membuka artikel-artikel yang terkait selain itu multiple target link juga dapat membantu sebagai peningkatan traffic bila teman-memiliki lebih dari satu web/blog, oke sekarang kita langsung ke intinya, untuk melihat contohnya dan script yang di gunakan lihat di bawah ini.

Klik Link ini : Multiple Target Link
Bila teman-teman tertarik berikut scriptnya :

<a href="javascript:(function() {window.open(' #');})() ; javascript:(function() {window.open (' #');}) (); javascript:(function() {window.open(' #');})() ; "> Multiple Target Link</a>

• Ganti simbol # dengan link yang teman-teman inginkan.
• Biala ingin lebih banyak tab teman-teman bisa copas script javascript:(function() {window.open(' #');})() ;
  

Penting...!!! Jangan terlalu banyak menambahkan target link, karena bisa saja terjadi Crash pada browser.
Semoga bermanfaat...!!!

Read More..

Membuat Menu Rocking and Rolling

Selamat malam sahabat blogger gimana kabarnya, semoga sehat selalu ya dan semoga tidak pernah bosan untuk membaca postingan saya, untuk sahabat blogger mungkin sudah tidak asing lagi mendengar kata menu navigasi, untuk postingan saya kali ini kita coba untuk membuat menu rocking & rolling. Menu ini sangat cocok buat sahabat-sahabat blogger yang suka mempercantik tampilan blognya, cara pembuatannya sangat mudah tinggal mengikuti langkah-langkah di bawah ini, yuk langsung kita mulai aja.

Sperti biasa saya tidak bosan-bosan untuk mengingatkan sebelum teman-teman mencoba tutorial ini mending kita lihat dulu demonya :

Nah sekarang kita buat menu seperti demo diatas.

• Seperti biasa masuk ke Edit HTML cari code ]]></b:skin> lalu copas script di bawah ini di atas code tadi.

/* -------------------------
amcied Logica
----------------------------------------------- */
.item{
position:relative;
background-color:#f0f0f0;
float:right;
width:52px;
margin:0px 5px;
height:52px;
border:2px solid #ddd;
-moz-border-radius:30px;
-webkit-border-radius:30px;
border-radius:30px;
-moz-box-shadow:1px 1px 3px #555;
-webkit-box-shadow:1px 1px 3px #555;
box-shadow:1px 1px 3px #555;
cursor:pointer;
overflow:hidden;
}
.link{
left:2px;
top:2px;
position:absolute;
width:48px;
height:48px;
}
.icon_home{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioxn4sjWELNBhrRrCSfq52M5XZdUFRTiMImI7nrWOSfk8Bw7hMQWRm2BO4CR5YxUTBN48I3ugWscNmYYydaNItvCnv9jE8_BDl60_AdGojV-4Y1PSFOdmQDmRT0sMl6YmU7LJqlIg3ya4/s1600/home.png) no-repeat top left;
}
.icon_mail{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcKNZiaZyIs0cKIl9qUMukKobBiUIosAnzV8ZRd35VXtwqn6iaX0jhmM9Snry2wbV4a_B6hyunAuHySoxiUrwF_vPeBXZ3FdGecwKnxlElMApKidjW4BNlWkuMM7QGIxCbkHiKcBhVN2E/s1600/mail.png) no-repeat top left;
}
.icon_help{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidkaUegICBWXUdaPh6KyJMjUeAkzReLIMRGTBK1jUaYSFQSUyCU7zqIWD7L6pp5XhxDZutvokcaa2pndbcnVO7kLEh8R1XQGw-MqIjDhUvJhxWR_hav-TZ_WIoHKFS5B0EZQHQEeMGrIE/s1600/help.png) no-repeat top left;
}
.icon_find{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhF1sEwSgJ7TzGD2i5sCKCEPOAbZ-61fzXSQOa4Yk9u7azFiPuLgUAFw3Cqb60ZO7H5kDk2Gi17qt413FHitB6Lm1uVeHk69gGntXC-Y_AR8eoPlyXfUAwznXMKtN8mHpSEAVcDnlo_PGY/s1600/find.png) no-repeat top left;
}
.icon_photos{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVKF7dYSTkegYO6Q2Pw1rympwTYAGrX1LxpCRWvTapVC-sCTcBahPseiRfee8JR7xvaB2gKPRJC7QyzsWmMbHdQuNw_NxgVITs35lDJubjUL1sxcfDLGB8uvgFQBZpgq6zxEvXx7vR6yk/s1600/photos.png) no-repeat top left;
}
.item_content{
position:absolute;
height:52px;
width:220px;
overflow:hidden;
left:56px;
top:7px;
background:transparent;
display:none;
}
.item_content h2{
color:#aaa;
text-shadow: 1px 1px 1px #fff;
background-color:transparent;
font-size:14px;
}
.item_content a{
background-color:transparent;
float:left;
margin-right:7px;
margin-top:3px;
color:#bbb;
text-shadow: 1px 1px 1px #fff;
text-decoration:none;
font-size:12px;
}
.item_content a:hover{
color:#0b965b;
}
.item_content p {
background-color:transparent;
display:none;
}
.item_content p input{
border:1px solid #ccc;
padding:1px;
width:155px;
float:left;
margin-right:5px;
}

• Selanjutnya copas lagi script di bawah ini di atas code </body>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="http://amcied.googlecode.com/files/jquery-css-transform.js" type="text/javascript"></script>
<script src="http://amcied.googlecode.com/files/jquery-animate-css-rotate-scale.js" type="text/javascript"></script>
<script>
$('.item').hover(
function(){
var $this = $(this);
expand($this);
},
function(){
var $this = $(this);
collapse($this);
}
);
function expand($elem){
var angle = 0;
var t = setInterval(function () {
if(angle == 1440){
clearInterval(t);
return;
}
angle += 40;
$('.link',$elem).stop().animate({rotate: '+=-40deg'}, 0);
},10);
$elem.stop().animate({width:'268px'}, 1000)
.find('.item_content').fadeIn(400,function(){
$(this).find('p').stop(true,true).fadeIn(600);
});
}
function collapse($elem){
var angle = 1440;
var t = setInterval(function () {
if(angle == 0){
clearInterval(t);
return;
}
angle -= 40;
$('.link',$elem).stop().animate({rotate: '+=40deg'}, 0);
},10);
$elem.stop().animate({width:'52px'}, 1000)
.find('.item_content').stop(true,true).fadeOut().find('p').stop(true,true).fadeOut();
}
</script>

• Yang terakhir copas script di bawah ini di mana saja yang teman-teman suka, tapi di sini saya mencoba copas di HTML/JavaScript

<div class="item">
<a class="link icon_find"></a>
<div class="item_content">
<h2>Search</h2>
<p>
<input type="text" />
<a href="">Go</a>
</p>
</div>
</div>
<div class="item">
<a class="link icon_mail"></a>
<div class="item_content">
<h2>Contact us</h2>
<p>
<a href="#">Facebook</a>
<a href="#">Twitter</a>
</p>
</div>
</div>
<div class="item">
<a class="link icon_help"></a>
<div class="item_content">
<h2>Help</h2>
<p>
<a href="#">FAQ</a>
<a href="#">Live Support</a>
<a href="#">About Us</a>
</p>
</div>
</div>
<div class="item">
<a class="link icon_photos"></a>
<div class="item_content">
<h2>Image Gallery</h2>
<p>
<a href="#">Photo Profil</a>
<a href="#">Images Archives</a>
</p>
</div></div>
<div class="item">
<a class="link icon_home"></a>
<div class="item_content">
<h2>Home</h2>
<p>
<a href="#">Kategori</a>
</p>
</div></div>

• Selesai, dan lihat hasilnya.

Selamat mencoba dan Semoga bermanfaat,...!!!

Read More..