02 Desember 2009

Memahami perbedaan ukuran CSS (px,em,%,pt)

. 02 Desember 2009
0 komentar

css Mungkin anda masih bingung dengan berbagai macam ukuran yang ada dalam pengaturan CSS. Bebeara diantaranya px (pixel), % (percent), pc (pica) dan pt (point),em (em) sedangkan untuk font xx-large, x-large, larger, large, medium, small, smaller, x-small,  xx-small dan length. satuan px dan pt merupakan besaran statis sedangkan em dan % adalah besaran relatif yang dihitung berdasarkan ukuran font pada body.

 

supaya anda tidak lagi silahkan kunjungi http://pxtoem.com, web ini menyediakan 3 menu utama yaitu convert (merubah ukuran dari px,ems,% dan pt), Get CSS (untuk melihat hasil css yang digenerate) dan learn (untuk lebih memahami satuan-satuan di atas)

 

pxtoem

Berikut ini kutipan cara perhitungan dari menu learn :

Note:16px is used as the body text size in all conversions because that is the browser default on today’s browser. You will change 16px to your base text size.

    • PX to EM: text size in pixels / body text size in pixels = size in EMs
      • Example: 12px / 16px = .75em
    • PX to %: text size in pixels / body text size in pixels * 100 = size in %
      • Example: 12px / 16px * 100 = 75%
    • PX to PT: text size in pixels * points per inch / pixels per inch = size in pt
      • Example: 16px * 72 (72 points = 1 inch) / 96 (96 pixels per inch in Windows, 72 in Mac) = 12pt
    • EM to PX: text size in EMs * body text size in pixels = size in pixels
      • Example: .75em * 16px = 12px
    • EM to %: text size in EMs * 100 = size in %
      • Example: .75em * 100 = 75%
    • % to PX: text size in % * body text size in pixels / 100 = size in pixels
      • Example: 75 * 16px / 100 = 12px
    • % to EM: text size in % / 100 = size in EMs
      • Example: 75 / 100 = .75em
    • PT to PX: text size in pt * pixels per inch / points per

Klik disini untuk melanjutkan »»

09 November 2009

Membuat Link Data Ms. Powerpoint 2007 dan Ms Excell 2007

. 09 November 2009
1 komentar

ms office Adakalanya saat membuat presentasi, kita perlu menampilkan data dari Ms. Excell. kita bisa saja copy langsung data dari Ms. Excell tsb. ke Ms. Powerpoint dalam bentuk table maupun gambar dari paste special. Cara ini akan tidak praktis apabila data data pada Ms. Excell berubah. kita juga harus merubah data pada Ms. Power point secara manual.

 

Ada sebuah cara yang lebih praktis untuk masalah di atas sebagai berikut :

 

  1. Misalkan kita mempunyai data di Ms. Excell yang akan kita tampilkan saat presentasi sbb :

     ep1 

    pilih data yang akan ditampilkan pada Ms. Power Point misalkan dari cell A2:E10 –> Copy
  2. Pada Ms Powerpoint –>klik panah kecil dibawah icon Paste untuk menampilkan opsi Paste –> Pilih Paste Special

    ep2 
  3. Seteleh muncul opsi Paste Special –> pilih Paste Link –> Microsoft Office Excel Worksheet Object –> pilih OK

    ep3 

    maka akan tampil sebuah data yang kita copy tersebut dalam bentuk gambar.

    ep4
  4. untuk menguji apakah benar ada koneksi data antara file di Ms. Excel dan Ms. Powerpoint, coba kita rubah angka 12 menjadi 10 pada cell A3 seperti gambar berikut :

    ep5 

    dan hasilnya di Ms. powerpoint adalah sebagai berikut :

    ep6
  5. Catatan : anda tidak bisa merubah format tampilan pada Ms. powerpoint karena data yang ditampilkan dalam bentuk gambar. jika anda ingin merubah tampilan data pada Ms. Powerpoint anda harus melakukannya di Ms. Excell dan secara otomatis format tampilan data di Ms. Powerpoint juga ikut berubah.


Klik disini untuk melanjutkan »»

28 Oktober 2009

Export Import Posting dan Comment dari Blogger

. 28 Oktober 2009
2 komentar

blogger Anda dapat mengekspor, mengimpor entri dan komentar dari blog Blogger yang telah diekspor sebelumnya. Selain untuk berjaga-jaga dari hal yang tidak diinginkan, dengan fasilitas export import ini anda dapat menggabungkan posting dari blog yang satu dengan blog yang lain.

 

Eksport Blog

 

  1. Masuk ke Blogger dashbord –>  Pengaturan –> Dasar –> Klik Ekspor Blog

    exp
  2. lalu klik Download/Unduh blog dan simpan hasil download blog anda dalam format xml

    dexp 

Import Blog

  1. Bila anda mempunyai beberapa blog di blogger dan anda ingin menyatukannya anda dapat mengeksport blog yang satu lalu anda buka blog lainnya lalu pilih impor blog

    imp 
  2. browse file xml hasil ekspor –> masukan kode verifikasi –> cek Terbitkan semua entri yang diimpor secara otomatis (bila anda ingin semua enteri hasil impor langsung diterbitkan) –> Impor Blog
  3. Tunggu sampai muncul pesan seperti gambar berikut :

    impres

    maka proses impor telah berhasil dengan sukses.

 

sedangkan untuk eksport dari blogger ke wordpress dapat dilakukan dengan cara berikut :

  1. login ke akun wordpress
  2. klik Perkakas > klik Impor > pilih Blogger > klik Beri kuasa
  3. Login ke blogger jika belum > Berikan Akses
  4. Pilih blog yang akan diimpor
  5. Klik Impor. maka semua posting dan comment dari blog tersebut akan tercopy ke Wordpress.

Klik disini untuk melanjutkan »»

25 Oktober 2009

Koneksi PHP dan Database Oracle Dengan Adodb

. 25 Oktober 2009
0 komentar

phplogo_thumb1 Berikut ini saya mencoba menuliskan cara koneksi PHP ke Oracle, mohon saran dari rekan-rekan bila ada kesalahan atau cara yang lebih baik.

Untuk membuat koneksi Sebelumnya anda harus mendownload adodb class yang berfungsi sebagai mesin penghubung PHP dan Oracle.

diumpamakan web directory kita adalah oracle_kompiku, download dan extract file adodb diatas ke dalam folder  oracle_kompiku

  1. misalkan saya mempunyai database oracle bernama laporan dan user=admin, password=admin
    maka script koneksinya adalah sebagi berikut :

    <?php
    include("adodb/adodb.inc.php");
    $oname = "admin";
    $opass  = "admin";
    $oserver= "laporan";
    $db = &ADONewConnection("ado"); # eg. 'mysql' or 'oci8'
    $myDSN="Provider=MSDAORA.1;User ID=$oname;Data Source=$oserver;Persist Security Info=False;Password=$opass;";
    $db->Connect($myDSN);
    $ADODB_FETCH_MODE = ADODB_FETCH_ASSOC;
    ?>

    simpan script di atas dengan nama connection.php
  2. selanjutnya saya coba membuat tabel sekaligus mencoba koneksi yang baru saya buat :

    <?php
    include("connection.php");
    $sql='create table USER_KOMPIKU( NAMA VARCHAR2(20), PASSWORD  VARCHAR2(9), TGL_DAFTAR DATE, COUNTER NUMBER)';
    $buat_db=$db->Execute($sql);
    //echo $sql;
         if (!$buat_db) {
                die(‘query error,database gagal dibuat’);
        }
        else{
        echo "Table User Kompiku Telah Dibuat";
        }
    ?>

    Pada script diatas saya membuat sebuah kontrol yang akan menampilkan pesan query error,database gagal dibuat bila ada kesalahan, namun bila koneksi dan query berhasil dieksekusi maka akan muncul pesan Table User Kompiku Telah Dibuat .Simpan script di atas dengan nama buat_db.php
  3. sekarang kita coba scrip di atas arahkan browser ke http://localhost/oracle_kompiku/buat_db.php dan hasilnya :

    reso

Klik disini untuk melanjutkan »»

Menambahkan Animasi Flash Tag Cloud Pada Label Blogger

blogger sebenarnya sudah banyak yang nulis cara masang tag cloud label dengan flash seperti gambar di bawah ini :
label
namun karena ada rekan yang menanyakan, saya iku juga menuliskan topik di atas. berikut ini caranya :

  1. Masuk ke Dashbord Blogger--> Tata Letak --> Edit HTML ---> Centarng Expand Widget Content
  2. Kalau diblog kamu sudah terpasang widget label ---> cari (ctrl+f) kode berikut : <b:widget id='Label
  3. delete semua kode dari <b:widget id='Label............> s.d. </b:widget> lalu ganti dengan script yang ada di bawah
  4. kalau di blog kamu belum ada widget Label cari kode berikut <b:section class=.……  ( classnya tergantung tempalte blog kamu misalnya sidebar dll) lalu copas saja script berikut dibawahnya
ini scripnya, met mencoba ya

<b:widget id='Label9' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
&lt;object type="application/x-shockwave-flash" data="http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf" width="250" height="200" allowscriptaccess="always" &gt;
&lt;param name="movie" value="http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf" /&gt;
&lt;param name="bgcolor" value="#ffffff" /&gt;
&lt;param name="flashvars" value="tcolor=0x000000&amp;mode=tags&amp;distr=true&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;
<b:loop values='data:labels' var='label'>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='12'><data:label.name/></a>
</b:loop>
&lt;/tags&gt;" /&gt;
&lt;p&gt;Blogumulus by &lt;a href='http://www.roytanck.com/'&gt;Roy Tanck&lt;/a&gt; and &lt;a href='http://www.bloggerbuster.com'&gt;Amanda Fazani&lt;/a&gt;&lt;/p&gt;
&lt;/object&gt;
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Klik disini untuk melanjutkan »»

22 Oktober 2009

Read More Widget dari Blogger

. 22 Oktober 2009
0 komentar

blgger Sekarang blogger sudah menyediakan fasilitas read more, sehingga anda yang memiliki blog di blogger tidak perlu repot menambahkan script untuk menambah fasilitas tersebut. anda cukup melakukan hal berikut :

 

Masuk ke Setting/pengaturan ---> pilih Editor yang diperbarui

 

setting

 

Maka editor enteri blogger anda akan ada sebuah fitur baru yaitu insert jump break yang berfungsi untuk menambahkan

 

 

setting2

 

anda tinggal klik ikon diatas untuk menyisipkan Read More, sehingga muncul garis seperti dibawa ini

 

setting5

 

jika anda ingin merubah Read More dengan kalimat lain klik Layout ----> Klik Edit pada Posting Blog

 

setting4

Pada opsi teks tautan lama entri anda dapat mengganti Read More dengan kata lain sesuai keinginan anda

 

setting3

Klik disini untuk melanjutkan »»
 
Kompiku.com Powered ByBlogger.com