• Kebijakan Privasi
  • Disclaimer
  • Hubungi Kami
  • Tentang Kami
MAS Al Ahrom Karangsari
  • Beranda
  • Visi dan Misi Madrasah
  • Pengumuman Madrasah
  • Menu Madrasah
    • Pendidik dan Tenaga Pendidik
    • RDM Madrasah
    • Info Madrasah
    • Pengumuman Kelulusan
    • Struktur Organisasi Madrasah
      • Struktur Organisasi Komite Madrasah
      • Struktur Organisasi Tata Usaha
      • Struktur Organisasi Perpustakaan
      • Struktur Organisasi Laboratorium Komputer
    • Mata Pelajaran
    • Pembelajaran
      • KTI Siswa-Siswi
      • Jurnal Madrasah
      • Jurnal Pengetahuan
      • Artikel Madrasah
    • Sarana Prasarana
  • Warga Madrasah
    • Pendaftaran
    • Login
    • Reset Password
    • Anggota
  • EN
No Result
View All Result
MA Al Ahrom Karangsari
No Result
View All Result

Home > Belajar Komputer dan Jaringan > Cara Menambahkan Custom CSS ke Situs Berbasis Joomla

Cara Menambahkan Custom CSS ke Situs Berbasis Joomla

Admin MAS Al Ahrom by Operator
Desember 26, 2021
in Belajar Komputer dan Jaringan

Custom.css adalah file tambahan yang dibuat oleh para web desainer pada CMS joomla yang dikhususkan untuk memodifikasi tampilan pada situs berbasis joomla. Pembuatan css kustom oleh pengguna atau penyedia template joomla difungsikan agar ketika template nanti di update maka tidak akan berpengaruh pada inti CSS file yang dimiliki CMS joomla. Sehingga bisa meminimalkan error pada saat pembaruan CMS joomla.

Banyak pengguna CMS Joomla melakukan pemasangan template atau ekstensi untuk merubah tampilan pada situs mereka. Namun, bagi kalian yang menginginkan tampilan yang lebih baik agar terlihat keren untuk para pengunjung, maka yang harus dilakukan adalah memodifikasi kode yang merupakan inti sistem joomla. Saya sendiri menyarankan agar kalian menambahkan custom.css daripada harus mengubah kode inti pada template.css yang merupakan core system CMS Joomla.

Menggunakan custom.css pada joomla memberi keleluasan untuk membuat desain website yang unik dan berbeda dari lainnya, memungkinkan kalian untuk menyesuaikan tampilan elemen yang dipih dari warna, ukuran, tata letak, dan lain-lain.

Pada tutorial ini, saya akan menunjukkan kepada kalian cara menambahkan Custom CSS untuk mengubah desain situs dengan aman. Saya sendiri pada panduan kali ini menggunakan CMS joomla versi terbaru yaitu 3.9.x dan juga bisa kalian gunakan untuk joomla versi 4.

Menambahkan File Custom.CSS Style CMS Joomla

  1. Masuk ke bagian Extension -> Templates -> Templates
    menambahkan custom.css kode ke joomla 1
  2. Pilih template yang ingin kalian tambahkan custom.css file
    menambahkan custom.css kode ke joomla 2Disini saya menggunakan templates Helix Ulttimate, tampilan sebelum ditambahkan kode custom.css lihat gambar dibawah ini.
    menambahkan custom.css kode ke joomla 3
  1. Pada menu diatas pilih New File, lalu akan muncul pop pembuatan file
    menambahkan custom.css kode ke joomla 4
  2. Lalu kalian klik folder css -> masukkan nama file bernama custom -> lalu pilih pada bagian Select File Type : css -> klik Create. Lihat pada gambar dibawah ini.
    menambahkan custom.css kode ke joomla 5
  3. Maka akan muncul file baru bernama custom.css disinilah nanti kalian akan mengisikan kode-kode untuk merubah tampilan website agar lebih terlihat lebih keren tanpa merubah struktur inti sistem templates.
    menambahkan custom.css kode ke joomla 6
  4. Selesai! Sekarang kalian tinggal berinovasi dengan berbagai tampilan pada template situs kalian.

Terakhir kalinya saya sarankan untuk jangan pernah edit template.css file atau CSS lainnya dari struktur sistem template yang sedang kalian gunakan. Alasannya adalah bahwa semua perubahan yang sudah kalian lakukan akan ditimpa ketika template melakukan pembaruan (kembali ke kode asli) dan ini bisa menyebabkan situs kalian akan error atau rusak. Sehingga kalian akan lebih tenang ketika akan ada update template terbaru. Sekian dari tutorial cara menambahkan custom css ke situs berbasis joomla. Semoga bermanfaat bagi kalian yang sedang belajar website yang menggunakan CMS joomla.

Related Article

Bagaimana Cara Menghilangkan ID Pada URL Joomla 4

Bagaimana Cara Menghilangkan ID Pada URL Joomla 4

Maret 9, 2025
Spesifikasi Minimun Untuk Menginstall Windows 10

Spesifikasi Minimun Untuk Menginstall Windows 10

Desember 26, 2021
Meningkatkan Performa Drive di Windows 10 Dengan Disk Write Cache

Meningkatkan Performa Drive di Windows 10 Dengan Disk Write Cache

Februari 10, 2025
Cara Memasang AMP Pada Situs Joomla Menggunakan wbAMP

Cara Memasang AMP Pada Situs Joomla Menggunakan wbAMP

November 2, 2022
Tags: Joomla
Previous Post

Bagaimana Cara Menampilkan Artikel Pada CMS Joomla!

Next Post

SEO Joomla: Menonaktifkan ID (Nomor) Pada URL Situs Joomla

Latest Posts

Media Manager Joomla 4: Fitur Edit Gambar Dengan Cepat Dan Mudah

Media Manager Joomla 4: Fitur Edit Gambar Dengan Cepat Dan Mudah

by Operator
April 12, 2025
0

Fitur terbaru dari Joomla 4 yang menjadi perhatian adalah fitur edit gambar dalam Media Manager yang sudah terpasang pada sistem...

Cara Menambahkan Kode Google Analytics Pada Joomla 4

Cara Menambahkan Kode Google Analytics Pada Joomla 4

by Operator
Maret 12, 2025
0

Menambahkan kode pelacakan google analytics ke dalam joomla 4 sangat penting bagi pemilik website untuk mengetahui performa dari setiap halaman...

Bagaimana Cara Menghilangkan ID Pada URL Joomla 4

Bagaimana Cara Menghilangkan ID Pada URL Joomla 4

by Operator
Maret 9, 2025
0

Joomla 4 telah diluncurkan dengan fitur-fitur barunya seperti Search Engine Optimization (SEO), pengalaman pengguna CMS joomla, media manajemen baru, dan...

Meningkatkan Performa Drive di Windows 10 Dengan Disk Write Cache

Meningkatkan Performa Drive di Windows 10 Dengan Disk Write Cache

by Operator
Februari 10, 2025
0

Pada windows 10, disk write caching adalah fitur yang digunakan untuk mempercepat sistem dengan cara menyimpan perintah pemrograman sementara pada...

Belajar Kartu Grafis Komputer Serta Komponennya

Belajar Kartu Grafis Komputer Serta Komponennya

by Operator
Januari 28, 2025
0

Kartu grafis merupakan expansi slot dalam komponen komputer yang mempunyai fungsi untuk memproses dan menampilkan gambar melalui monitor. Prinsip kerja...

Tinggalkan Balasan Batalkan balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

I agree to the Terms & Conditions and Disclaimer.

Popular Posts

Efisiensi Pareto : Konsep, Model, Serta Kondisi Tercapainya
Ekonomi

Efisiensi Pareto : Konsep, Model, Serta Kondisi Tercapainya

by Aida
Januari 4, 2022
0

Dalam konteks kaitannya dengan penyediaan barang publik oleh pemerintah, maka yang menjadi tujuan akhir adalah meningkatkan kondisi pareto...

Efisiensi Pareto : Konsep, Model, Serta Kondisi Tercapainya

Efisiensi Pareto : Konsep, Model, Serta Kondisi Tercapainya

by Aida
Januari 4, 2022
0

modul sejarah peminatan kelas 11

Modul Sejarah Kelompok Peminatan Kelas 11 SMA/MA

by Operator
Mei 25, 2022
0

Teori Hak Kekayaan Intelektual, dan Undang-Undang yang Mengaturnya di Negara Indonesia

Teori Hak Kekayaan Intelektual, dan Undang-Undang yang Mengaturnya

by Fatkul Mansyah
Januari 13, 2022
0

No Result
View All Result

Kategori

Efisiensi Pareto : Konsep, Model, Serta Kondisi Tercapainya

Teori Hak Kekayaan Intelektual, dan Undang-Undang yang Mengaturnya

Sejarah Perkembangan Islam Periode Modern

Sejarah Perjalanan Hijrah Rasulullah SAW Ke Kota Madinah

Konsep Sustainable Development (Pembangunan Berkelanjutan) Menurut Ahli

MA AL Ahrom Karangsari

Madrasah yang berdiri sejak tahun 2009, terletak di jalan Nangka No. 45 Karangsari, Karangtengah, Demak.

logo footer ma al ahrom

Bantuan

  • Kebijakan Privasi
  • Disclaimer
  • Hubungi Kami
  • Tentang Kami

Sosial Media MA AL AHROM

Mari Follow dan Ikuti setiap kegiatan MA AL Ahrom Karangsari di social media kami.

© 2021 MA Al Ahrom Karangsari – Design by MA Al Ahrom.

  • EN
No Result
View All Result
  • Beranda
  • Visi dan Misi Madrasah
  • Pengumuman Madrasah
  • Menu Madrasah
    • Pendidik dan Tenaga Pendidik
    • RDM Madrasah
    • Info Madrasah
    • Pengumuman Kelulusan
    • Struktur Organisasi Madrasah
      • Struktur Organisasi Komite Madrasah
      • Struktur Organisasi Tata Usaha
      • Struktur Organisasi Perpustakaan
      • Struktur Organisasi Laboratorium Komputer
    • Mata Pelajaran
    • Pembelajaran
      • KTI Siswa-Siswi
      • Jurnal Madrasah
      • Jurnal Pengetahuan
      • Artikel Madrasah
    • Sarana Prasarana
  • Warga Madrasah
    • Pendaftaran
    • Login
    • Reset Password
    • Anggota

© 2021 MA Al Ahrom Karangsari - Design by MA Al Ahrom.