CSS Hero Review: WordPress Design Customization Made Easy

Hvis du er en av de mange nybegynnerne som ønsker å tilpasse WordPress-nettsteddesignet uten å berøre CSS, er du heldig. CSS Hero-plugin for WordPress lar deg lage designtilpasning uten å berøre en eneste kodelinje. I denne oppdaterte CSS Hero-gjennomgangen vil vi vise deg hvordan du bruker CSS Hero til å tilpasse nettstedet ditt, og hvorfor vi tror det er et av pluginene hver WordPress-nybegynner bør prøve.


CSS Hero anmeldelse

CSS Hero Review

CSS Hero er et premium WordPress-plugin som lar deg designe ditt eget WordPress-tema uten å skrive en eneste kodelinje (Ingen HTML eller CSS kreves).

Du har muligheten til å angre endringer, noe som er veldig nyttig for nybegynnere. Alle endringene lagres som et ekstra stilark, noe som betyr at du kan oppgradere WordPress-temaet uten å bekymre deg for å miste endringene.

Hvis du er en designer eller utvikler, vil du finne CSS Hero like bra. Det fungerer bra med alle populære WordPress-temaer og rammer. Du kan raskt gjøre endringer i et barnetema, og deretter eksportere det for å bli brukt på en kundes nettsted.

CSS Hero kan spare deg for mye tid og frustrasjon når det gjelder å gjøre designtilpasninger.

Vanligvis er vi veldig skeptiske til plugins for tilpasning av pek-og-klikkdesign på grunn av oppblåst størrelse. Imidlertid imponerte CSS Hero oss helt fra starten.

Hvis du skulle be oss om en ærlig CSS Hero-anmeldelse, vil vi gi den en 5 av 5 stjerner.

Slik bruker du CSS Hero til å tilpasse ditt WordPress-tema

Først må du installere og aktivere CSS Hero-plugin. For mer informasjon, se vår trinnvise guide for hvordan du installerer en WordPress-plugin.

Det er et premium WordPress-plugin med priser som starter fra $ 29 for et enkelt nettsted (absolutt verdt investeringen med tanke på tiden og bryet det vil spare deg).

Bruk CSS Hero-kupongkoden: WPBeginner for å få en spesiell rabatt på 34% avslag. Hvis du kjøper PRO-planen, vil den samme koden gi deg hele 40% rabatt.

Etter aktivering vil du bli omdirigert for å få CSS Hero License-nøkkelen. Bare følg instruksjonene på skjermen, så blir du omdirigert tilbake til nettstedet ditt med noen få klikk.

Målet med CSS Hero er å gi deg et WYSIWG (det du ser er hva du får) for å redigere temaet ditt. Bare besøk nettstedet ditt mens du er logget inn, så vil du legge merke til CSS Hero-knappen i WordPress administrasjonsfelt.

CSS Hero-knapp

Hvis du klikker på knappen, konverteres nettstedet ditt til live-forhåndsvisning. Du vil nå kunne se CSS Hero-verktøylinjen.

CSS Hero live redaktør

Deretter klikker du bare på hvilket som helst element på nettstedet ditt, og CSS Hero vil vise deg CSS-egenskapene som brukes av temaet ditt for det aktuelle elementet..

Elementegenskaper

Disse vil inkludere vanlige CSS-egenskaper for det valgte elementet som bakgrunn, typografi, grenser, avstand og mer. Du kan klikke på et hvilket som helst element for å utvide det og deretter redigere CSS-egenskapene ved hjelp av et enkelt brukergrensesnitt.

Redigere egenskaper

Når du gjør endringer, vil du legge merke til at den tilpassede CSS magisk vises nedenfor. Hvis du lærer CSS, vil du finne det nyttig å se hvordan forskjellige CSS-endringer brukes med resultatet i live-forhåndsvisning.

Redigeringsstiler for forskjellige elementer ved hjelp av CSS Hero

Har du problemer med å finne avgiftsfrie bilder på nettstedet ditt? CSS Hero kommer med innebygd Unsplash-integrasjon som lar deg bla gjennom, søke og bruke vakre fotografier i nettstedets design.

Bruke royaltyfrie bilder i nettstedets design

CSS Hero kommer også med noen ferdige utdrag som du kan bruke på forskjellige elementer på nettstedet ditt. Bare bytt til kategorien Utdrag i venstre kolonne.

CSS helt ferdige tekstutdrag

Når du gjør endringer på nettstedet ditt, vil CSS Hero lagre disse endringene automatisk, men ikke publisere dem. For å bruke disse endringene på ditt live nettsted, må du klikke på Lagre og publisere-knappen.

Lagre og publiser endringene dine

Hvordan angre endringer i CSS Hero

En av de beste funksjonene i CSS Hero er muligheten til å angre endringer du når som helst. CSS Hero holder en historie med alle endringene du gjør i temaet ditt. Bare trykk på historikk-knappen på CSS Hero-verktøylinjen for å se listen over endringer.

CSS Hero historie

Du kan klikke på en dato og et tidspunkt for å se hva nettstedet ditt så ut på det punktet. Hvis du vil gå tilbake til den tilstanden, kan du bare lagre eller fortsette redigeringen fra det punktet.

Dette betyr ikke at endringer du gjorde etter dette tidspunktet ville forsvinne. De vil fremdeles være lagret, og du kan også gå tilbake til den tiden. Det blir ikke noe enklere enn det.

Men hva hvis du bare ønsket å tilbakeføre endringer du gjorde til et bestemt element?

I så fall trenger du ikke bruke historieverktøyet. Bare klikk på elementet du vil tilbakestille, og klikk deretter på tilbakestill-knappen.

Tilbakestill et enkelt element

Dette vil endre elementet tilbake til standardinnstillingene som er definert av WordPress-temaet.

Tilpasse nettstedet ditt for mobile enheter i CSS Hero

Det mest utfordrende ved webdesign er enhetskompatibilitet. Du må sørge for at nettstedet ditt ser like blendende ut på alle enheter og skjermstørrelser. Nettdesignere bruker en rekke verktøy for å teste for kompatibilitet med nettlesere og enheter. Heldig for deg, CSS Hero kommer med et innebygd forhåndsvisningsverktøy.

Bare klikk på skrivebordsikonet i CSS Hero-verktøylinjen, og klikk deretter på en enhetstype. Du kan velge mellom mobile, nettbrett og stasjonære enheter. Forhåndsvisningsområdet vil endres til den valgte enheten.

Redigering i forskjellige enhetsmodus

Du kan nå redigere nettstedet ditt mens du forhåndsviser det for mobile enheter. Dette verktøyet er spesielt nyttig for å finpusse temaets design for mobil og nettbrett.

CSS Hero Theme Compatibility

Det offisielle CSS Hero nettstedet har en stadig voksende liste over kompatible temaer. Denne listen inkluderer mange av de beste gratis WordPress-temaene. Den har også de mest populære premium-temaene fra butikker som CSSIgniter, Themify, StudioPress og mer.

Hva med temaer som ikke er på temakompatibilitetsliste?

CSS Hero kommer med en funksjon som heter Rocket Mode Auto-detect. Hvis du bruker et tema som ikke er inkludert i listen over temakompatibiliteter, vil CSS Hero automatisk begynne å bruke rakettmodus.

Rocket Mode prøver å gjette CSS-velgerne fra temaet ditt på egen hånd. Dette fungerer perfekt det meste av tiden. Hvis temaet ditt følger WordPress-kodingsstandarder, vil du kunne redigere nesten alt.

Det kan også være lurt å kontakte temautvikleren din og be dem om å gi kompatibilitet med CSS Hero.

Hvilke plugins er kompatible med CSS Hero?

CSS Hero testes regelmessig med topp WordPress-plugins for kompatibilitet. Dette inkluderer kontaktskjema-plugins, populære sidebyggere, WooCommerce og andre.

Hvis du bruker en WordPress-plugin som genererer en utgang som ikke er redigerbar av CSS Hero, kan du be plugin-forfatteren om å fikse det. De trenger virkelig ikke gjøre mye for å gi kompatibilitet med CSS Hero.

Vi håper at du fant CSS Hero-anmeldelsen nyttig. Det kan også være lurt å se den ultimate guiden vår for å forbedre WordPress-hastighet og ytelse for nybegynnere.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map