Membuat Anotasi Keren di Cisco Packet Tracer

October 21, 2017


Ketika kita membuat topologi jaringan pada aplikasi Cisco Packet Tracer, tentunya kita juga harus memberikan keterangan untuk memperjelas topologi yang kita buat. Misal, dalam sebuah jaringan komputer tentunya terdapat sistem pengalamatan IP yang digunakan oleh setiap perangkat jaringan khususnya end device, maka kita perlu untuk memberikan keterangan ip address pada topologi yang kita buat. Tidak hanya ip address namun juga subnetmask serta gateway jika diperlukan. Catatan yang digunakan untuk memberikan keterangan penjelas ini disebut dengan anotasi.

Gambar ilustrasi

Apa itu anotasi ? Menurut KBBI, anotasi adalah catatan yang dibuat oleh pengarang atau orang lain untuk menerangkan, mengomentari, atau mengkritik teks karya sastra atau bahan tertulis lain. Jadi anotasi pada cisco packet tracer bisa kita artikan sebagai catatan yang dibuat untuk menerangkan atau memperjelas topologi yang dibuat.

Saya akan contohkan bagaimana membuat anotasi pada topologi yang saya bangun. Lihat gambar di bawah ini :

Contoh topologi dengan anotasi
Gambar di atas merupakan anotasi yang biasa saya buat untuk memperjelas topologi yang saya gunakan untuk simulasi jaringan. Mungkin teman-teman yang lain punya cara masing-masing dalam mebuat catatan tersebut.

Tapi tahukah kalian bahwa kita bisa membuat catatan dalam bentuk yang keren di Cisco Packet Tracer ? Keren bagaimana yang dimaksud ? Misalkan kamu ingin membuat catatan tentang pengalamatan IP untuk topologi di atas, tapi kamu ingin membuatnya dalam bentuk tabel. Nah, kamu bisa membuat style untuk tabel yang akan kamu buat. 

Untuk membuat tabel dengan style yang keren kamu bisa memanfaatkan CSS. CSS untuk mendesain web ? Iya. Jadi kamu harus memahami setidaknya html dan css untuk membuat anotasi yang keren ini.

Langsung saja simak langkah-langkah berikut. Saya akan contohkan membuat anotasi tabel pengalamatan IP pada topologi di atas dengan menambahkan style css untuk memperindah tampilannya.

Pertama, silahkan buka aplikasi editor untuk coding seperti notepad++, sublime text, atau notepad biasa juga tidak apa-apa.

Kemudian buat tabel dengan sedikit style CSS. Di sinilah kamu dapat berkreasi untuk membuat style yang kamu inginkan. Dan di bawah ini adalah contoh coding tabel yang saya buat :
<html>
<head>
<title></title>
<style>
table, th, td {
 border: solid black 1px;
 border-collapse: collapse;
 border-color: black;
}
th, td {
 padding: 10px;
 font-family: calibri;
}
th {
 text-justify: auto;
 background-color: #546E7A;
 color: white;
 font-weight: bold;
 font-family: calibri;
}
</style>
</head>
<body>
 <table>
  <tr>
   <th>Device</th>
   <th>Interface</th>
   <th>IP Address</th>
   <th>Subnetmask</th>
   <th>Gateway</th>
  </tr>
  <tr>
   <td>Router</td>
   <td>FastEthernet 0/0</td>
   <td>192.168.0.254</td>
   <td>255.255.255.0</td>
   <td style="text-align: center;">N/A</td>
  </tr>
  <tr>
   <td>PC 1</td>
   <td>FastEthernet 0</td>
   <td>192.168.0.1</td>
   <td>255.255.255.0</td>
   <td>192.168.0.254</td>
  </tr>
  <tr>
   <td>PC 2</td>
   <td>FastEthernet 0</td>
   <td>192.168.0.2</td>
   <td>255.255.255.0</td>
   <td>192.168.0.254</td>
  </tr>
 </table>
</body>
</html>

Silahkan cek dahulu tampilannya melalui browser. Jika sudah sesuai, copy semua kode tersebut, kemudian pindah ke jendela cisco packet tracer. Klik icon Place Note pada sidebar, lalu pastekan kode yang sudah disalin tadi.

Paste kode html ke workspace CPT

Maka tulisan yang sebelumnya berbentuk kode-kode html akan berubah menjadi sebuah tabel. Dan seperti inilah tabel yang saya buat :

Contoh topologi dengan styling anotasi
Topologi menjadi terlihat lebih rapi dan juga keren. Bagaimana, apakah sudah paham apa yang saya bahas pada postingan ini ? Jika sudah silahkan kamu berkreasi membuat anotasi yang indah agar topologi yang kamu buat menjadi lebih bagus. Kalau masih bingung dengan langkah-langkah yang saya jealskan di atas, silahkan lihat gif di bawah ini :

Langkah-langkah mempaste kode html ke dalam CPT

Sayangnya cara ini hanya dapat digunakan pada CPT versi 7.1 . Untuk versi 7.0 ke bawah belum bisa menggunakan cara ini. Kalau kamu ingin mengunduh CPT terbaru langsung saja download di situs resmi netacad atau bisa juga melalui link ini (Win 64bit).

Demikianlah cara membuat anotasi pada packet tracer menjadi lebih stylist dan keren. Semoga bermanfaat.



Referensi :
youtube.com/watch?v=uGv1IErLOFM&t=8s
kbbi.web.id



Load Comments