Transformacja WordPress pod Core Web Vitals

Zapraszam wszystkich na powtórkę z sesji live. Tym razem coś innego, kompletnie za darmo otwieram przed Wami możliwość nauczenia się ogromnej ilości wiedzy o stronach www.

Pokazuję i opowiadam jak wygląda kompletny proces transformacji strony www. Za przykład służy mi strona adamjanoszek.com. Krok po kroku, każdy ma szansę zobaczyć jak to się robi.

  • Instalacji WordPress,
  • przenoszenie starej instalacji,
  • optymalizacja,
  • tworzenie struktury,
  • praca z Gutenberg,
  • praca ze zdjęciami na stronie www
  • i mnóstwo innych tematów.

Obejrzyj już dzisiaj

https://vimeo.com/466570682

Materiały dodatkowe

Na wstępnie, wypadałoby mieć świetny hosting… dlatego warto zainwestować w hosting dla WordPress od Serwer.io. Kolejne narzędzia są za free… ale jak chcesz zdominować kwestie design, to polecam wersję premium motywu GeneratePress.

Lista użytych wtyczek:

Snippety

Poniższe snippety wklejamy w style.css (child theme)

Zdjęcia szersze niż tekst (Wide Width)

@media (min-width: 1025px) {
.entry-content .alignwide, body:not(.no-sidebar) .entry-content .alignfull {
    margin-left: -103px;
    width: calc(100% + 192px);
    max-width: calc(100% + 192px);
}
}

Pogrubiony font w menu wybranej strony

.main-navigation .main-nav ul li[class*="current-menu-"] > a {
    font-weight: 600;
}

Tytuł posta/strony na środku

.entry-title {
    text-align: center;
}

Wyłączenie animacji postów Qubely

.qubely-postgrid:not(.qubely-postgrid-style-4) .qubely-post-img.qubely-post-img-zoom-in .qubely-post-image,
.qubely-postgrid:not(.qubely-postgrid-style-4) .qubely-post-img.qubely-post-img-zoom-out .qubely-post-image {
-webkit-transform: scale(1);
transform: scale(1);
}

Zmiana wielkości fontu w GravityForms – notka prywatności

.gform_wrapper form li, .gform_wrapper li {
    font-size: 12px;
}

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *