• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

RMGTmagazine

Portal Wawasan Online

  • Teknologi
  • Instagram
  • WhatsApp
  • Email

About

Thanks for importing Broadcast ๐Ÿ™‚

Broadcast is constructed primarily using GPโ€™s awesome built-in features with some CSS to provide custom styles.

The sections below provides a quick overview on how the site was built and some potential modifications. All the CSS mentioned below can be found in the Additional CSS field in the customizer.

Header/Navigation

The header/navigation is simply created using the customizer options. You can modify them in Site Identity, Primary Navigation and Sticky Navigation sections in the customizer.

Header Element/Page Hero

The section below the primary navigation is created using the Header Element module. You can find 4 header elements in
Appearance > Elements: Pages hero, Archives hero, Posts hero and Home hero.

CSS is used to provide a unique container width, gradient background and styles for the <h2> and <p> elements:

/* Page hero styles */
.page-hero.gradient {
    background-image: linear-gradient( 145deg, transparent 0%, rgba(255,255,255, 0.5) 100%);
    max-width: 1440px;
    margin: auto;
}
.inside-page-hero h2 {
    font-size: 40px;
}
.inside-page-hero p {
    font-size: 20px;
}

This site is an excellent resource to tweak the gradient to your liking: https://cssgradient.io/.

General Container

The following CSS is used to style the main container, include merging with the header element above.

/* Main container styles */
.separate-containers .site-main {
    margin-top: -80px !important;
}
@media (max-width: 768px) {
    body .site.grid-container {
        margin-left: 20px;
        margin-right: 20px;
    }
}
.site-content .inside-article, .sidebar .widget, .comments-area {
    box-shadow: 0px 0px 0px 1px rgba(214,218,222,1);
}

Posts List

The home page posts list can be modified using our Blog module.

Here is the CSS used to style them:

/* Posts grid styles */
@media (min-width: 769px) {
    .generate-columns .inside-article {
        transition: all 0.2s ease-in;
        transform: scale(1);
    }
    .generate-columns .inside-article:hover {
        transform: scale(1.01);
        box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);
    }
    p.read-more-container {
        opacity: 0;
        transition: all 0.3s ease-in-out;
    }
    .generate-columns .inside-article:hover p.read-more-container {
        opacity: 1;
    }
}
.generate-columns .inside-article {
    display: flex;
    flex-direction: column;
    border-radius: 3px;
}
.generate-columns .inside-article .entry-summary {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.entry-summary p:not(.read-more-container) {
    display: none;
}
.read-more-container {
    margin-top: auto;
    text-align: center;
}
button, html input[type="button"], input[type="reset"], input[type="submit"], a.button, a.button:visited {
    border-width: 1px;
    border-style: solid;
    border-color: inherit;
    border-radius: 3px;
}
.blog footer.entry-meta, .archive footer.entry-meta {
    margin-top: 0;
}

Sidebar

The plugin Recent Posts Widget With Thumbnails is used in the left sidebar widgets area to show recent posts in single posts.

The first sidebar widget is colored with this CSS below:

/* Sidebar styles */
.sidebar .widget:first-child {
    background-image: linear-gradient( 145deg, rgb(164,218,216) 0%, rgb(228,243,242) 100%);
}

Primary Sidebar

Terbaru

  • Inilah Penyebab Status WhatsApp Teman Tidak Muncul
  • Begini Cara Mudah Menggunakan WhatsApp Web di PC dan Laptop Anda
  • [Pasti Pas!] Rekomendasi Ukuran Instagram : Foto, Video dan Stories
  • 7 Cara Mendapatkan Simbol Centang Biru di Instagram
  • 6 Merk Harddisk yang Bagus untuk Menyimpan Data Anda

Terpopuler

Inilah Penyebab Status WhatsApp Teman Tidak Muncul
Terbaru! Cara Tambah Akun di Instagram Anda dengan Mudah
Begini Cara Mengecek Nomor Tri Sendiri
Cara Update Aplikasi Android [Lengkap disertai Gambar]
Cara Screenshot di Laptop Lenovo

Terbaru

  • Inilah Penyebab Status WhatsApp Teman Tidak Muncul
  • Begini Cara Mudah Menggunakan WhatsApp Web di PC dan Laptop Anda
  • [Pasti Pas!] Rekomendasi Ukuran Instagram : Foto, Video dan Stories
  • 7 Cara Mendapatkan Simbol Centang Biru di Instagram
  • 6 Merk Harddisk yang Bagus untuk Menyimpan Data Anda

Terpopuler

Inilah Penyebab Status WhatsApp Teman Tidak Muncul
Terbaru! Cara Tambah Akun di Instagram Anda dengan Mudah
Begini Cara Mengecek Nomor Tri Sendiri
Cara Update Aplikasi Android [Lengkap disertai Gambar]
Cara Screenshot di Laptop Lenovo

Copyright © 2025 ยท RMGTMAGZ

  • About Us
  • Kontak
  • Disclaimer
  • Privacy Policy