Joomla Indonesia

Login or Sign Up
Sign In or Register
Avatar
Not Registered Yet?

Join Now! It's FREE. Get full access and benefit from this site

Reset My password - Remind Me My username

Username
Password
Remember me
  • Home
    Home This is where you can find all the blog posts throughout the site.
  • Categories
    Categories Displays a list of categories from this blog.
  • Tags
    Tags Displays a list of tags that have been used in the blog.
  • Bloggers
    Bloggers Search for your favorite blogger from this site.
  • Team Blogs
    Team Blogs Find your favorite team blogs here.
  • Login
    Login Login form

Menambahkan Style Warna dan Border Pada Text Joomla

Posted by on in Tip Dan Trik
  • Font size: Larger Smaller
  • Hits: 12093
  • 7 Comments
  • Subscribe to this entry
  • Print

Hallo semua pengguna Joomla... langsung saja ya, artikel ini ber fungsi untuk membuat suatu text paragraph yang sudah di buat style nya oleh kita sendiri, karena jika pada style bawaan template terkadang masih ada keterbatasan untuk kita lebih meng eksplore warna dan dan jenis font... hasil modifikasi nya bisa anda lihat pada gambar di berikut ... 

-

Pertama, masuk ke CSS editor template anda.

berikut langkahnya :

1. login ke administrator joomla : Site-> Template manager->site template
2. Pilih template yg anda gunakan saat itu, lalu pilih tombol  EDIT CSS  

catatan : pastikan file CSS template anda dalam kondisi

"WRITEABLE" yg berarti template tersebut dapat di modifikasi oleh

kita


3. Sekarang kita akan menambahkan sedikit style pada file CSS tersebut....tarik gulung ke area paling bawah, karena kode ini saya sengaja memasukkannya di area paling bawah, agar nanti bila kita ingin meng edit kembali jadi mudah, ga perlu cari-cari lagi.{xtypo_code}p.informasi {
border: 2px solid #E6002E;
background-color: #FFA78A;
padding: 6px;
font-family: verdana, helvetica, sans-serif;
font-size: 15px;
}{/xtypo_code}


keterangan :

p. = adalah style (paragraph) yg akan kita tambahkan
informasi = nama dari style paragraph tersebut yg nantinya akan

kita bisa kita gunakan di setiap berita.

untuk keterangan lainnya, anda bisa modifikasi sesuka hati anda .

Silahkan untuk mempelajari atributenya lebih jelas nya disiini

dan, bagi anda yg ingin merubah kode2 warna hexa bisa lihat di website ini  

4. Setelah anda memasukkan style di atas, jangan lupa untuk SAVE. Style css sudah kita buat, lalu kita tinggal memilih berita mana yang akan berikan text hasil dekorasi ini...sebagai contoh, saya ingin menambahakan text tersebut di artikel saya yg ber judul "WELCOME TO JOOMLA"  (judul joomla default) Cool

5. Saya asumsikan anda sudah berada pada editor content item yg anda buat di situs Joomla anda, pada text editor pilih edit by HTML (lihat gambar)



masukkan kode berikut pada HTML editor anda :

{xtypo_code} <p class="informasi"> Disini adalah text isian pengumuman
pada website Joomla anda</p>
{/xtypo_code}


jika di rasa sudah selesai, maka pilih tombol "UPDATE"

FINISH, sekarang anda dapat meletakkan di area mana saja pada artikel joomla anda..


catatan :

anda juga bisa meletakkannya pada salah satu module Joomla anda, contohnya yg saya buat di template default installasi Joomla : rhuk_solarflare_ii

contoh sebelum di dekorasi :

 

 

contoh sesudah di dekorasi :

 

Semoga artikel sederhana ini dapat bermanfaat bagi anda yg ingin leluasa memodif infromasi text tambahan pada situs Joomla anda  :)



Regards


Rizky 

http://www.rizkyonline.com 

http://indodisain.net 

0

People in this conversation

  • Guest - Niki Nugraha

    Tapi tulisannya kok bleber kesamping gt ya mas???
    Yg paragraft pertama??
    Jadi ga bs baca apa itu...hehehe...

    0 Like Short URL:
  • Guest - Niki Nugraha

    Tapi tulisannya kok bleber kesamping gt ya mas???
    Yg paragraft pertama??
    Jadi ga bs baca apa itu...hehehe...

    0 Like Short URL:
  • Guest - sayurasem

    nambah lagi deh ilmu
    thanks

    0 Like Short URL:
  • Guest - sigitkputra

    Makasih yaa mas infonya 8)

    jadi pengen banyak tau tentang joomla nih :)

    0 Like Short URL:
  • Guest - yanherdiana

    maaf ni mas , gambar nyang setelah didekorasi ko ga muncul mas ??

    0 Like Short URL:
  • Guest - rizkyonline

    mohon maaf...sepertinya hosting imagenya bermasalah
    saya sudah contact admin untuk memperbaiki dengan gambar yg baru
    tgu saja ya :)

    thanks

    0 Like Short URL:
  • Guest - kaka99

    bagus juga nih.. bisa langsung dicoba, biar lebih kreatif.
    :grin

    0 Like Short URL:

Kategori Blog

Joomla User Group Indonesia

Joomla User Group indonesia

Id-joomla.com adalah situs resmi Joomla User Group (JUG) Indonesia dan Joomla Translation Team

 
Download Terjemahan Joomla terakreditasi dari JoomlaCode dan laporkan bugs, ide dan saran nya di Sub Forum Hanacaraka

Socials

twitter id joomlafb idjoomla