Bygg en blogg fra grunnen av med frosk CMS

Vi pleier å dekke mange CMSs; spesielt WordPress-relatert materiale og emner. Mens WordPress er et helt fantastisk CMS, er det noen andre innholdsstyringssystemer der ute som ikke får kreditt de fortjener. Et viktig å merke seg er Frog CMS, et åpen kildekode-system for enkel innholdsbehandling. Fra det jeg kan fortelle, den største grepet har å gå for det er dens enkelhet. Det føles flammende raskt og måten alt er organisert på, er veldig intuitivt. I dag tar vi en grundig titt på å komme i gang med Frosk CMS, i tillegg til å bygge vår egen blogg fra grunnen av.

Endelig forhåndsvisning

Se demo

Ovennevnte bilde er et skjermbilde av hva vår Frosk CMS-blogg vil se ut når vi er ferdige med denne opplæringen. Husk at vi bruker standardtemaet for tiden.

Trinn 1: Installere frosk

Som med de mest populære innholdshåndteringssystemene, bruker Frog en MySQL-database for å lagre de fleste dataene dine. Du må opprette en database for froskinstallasjonen din. Pass på å notere brukernavnet ditt, passordet og verten som du vil trenge denne informasjonen for installeringssiden.
Når du har opprettet databasen, last ned og installer Frog CMS et sted på serveren din. For denne artikkelen vil vår installasjon være på http://dev-tips.com/frog_cms/, det er en faktisk demoside du kan sjekke ut og bla hvis du ønsker det.
Når du har lastet opp Frosk til serveren din, navigerer du til katalogen du har installert den i. Noe som yoursite.com/ribbit/

Du bør bli brakt til installasjonssiden, der du vil fylle ut alle dataene for databasekonfigurasjonen. Se skjermbildet nedenfor:

Fyll ut alle nødvendige felt og send skjemaet. Hvis alt går bra vil du bli presentert med brukernavn og passord. Husk å nøye merke dette passordet og husk å endre det når du logger inn! Se skjermbildet nedenfor for suksesssiden.

Nå må vi følge instruksjonene nederst på installasjons suksess paged på bildet ovenfor. Pass på at du gjør følgende trinn, eller Frosk vil deaktivere bloggen på grunn av sikkerhetsproblemer (som faktisk er en fantastisk funksjon).

Slett installasjonsmappen. Hele mappen.
Endre tillatelsene (Chmod, du bør kunne gjøre dette med FTP-editoren din, i Coda kan du høyreklikke på filen og klikke på "få info") på config-filen for å lese bare. Du vil fjerne alle skrive-tillatelser, etterlate deg et tillatelsesnummer (vel, oktalt) på 444. Et skjermbilde er under for å avklare eventuelle misforståelser.
Fjern eventuelle filer du ikke trenger, for eksempel changelog.txt og install.txt etc.
Naviger til innloggingssiden via lenken som er gitt til deg (bildet nedenfor).

Bildet ovenfor: fjerner skriverettigheter fra config.php

Bildet ovenfor: Frog login skjerm.

Gå videre og logg inn, du er ferdig med installasjonen!

Trinn 2: Lære det grunnleggende

Når du har logget inn, gå videre og ta en stund for å utforske baksiden av Frog CMS og prøv å få en følelse av hvordan alt fungerer. Jeg tror du vil bli veldig imponert over Frogens enkelhet og fleksibilitet rett utenfor flaggermuset. Jeg går over noen få betingelser her raskt for å få deg til å jobbe med Frøkenes bakgrunner.

sider: Dette er hvor alt ditt hovedinnhold vil bli holdt, lagt til og redigert. Individuelle artikler er også holdt her. Ikke vær forvirret av dette, artikler har egne barn og er fortsatt skilt fra enkelte sider. Hvis du vil opprette en ny side, klikker du bare på pluss ikonet under 'Hjem'. Hvis du vil legge til en ny artikkel, trykker du bare på plussikonet i artikkelsubsnittet.
artikler:Som enhver blogg, kan du ha artikler og individuelle statiske sider. Som diskutert ovenfor, er artiklene faktisk plassert under sidene i sitt eget undergruppe. Hvis du vil skrive et nytt blogginnlegg, klikker du bare på plussikonet av artikelsubsetet.
Tekstutdrag: Dette er en av funksjonene jeg tror gjør Groda veldig bra og veldig enkelt. Tenk på utdrag som en fancy php inkluderer. Du har opprettet en ny utdrag, som kan inneholde noen form for oppføring eller språk du ønsker. Du kan deretter få tilgang til denne brikken hvor som helst i websiten din ved å ringe $ Dette-> includeSnippet ( 'snippet_name');. Senere vil vi se på hvordan du bruker utdrag for våre sidebarannonser.
oppsett: Tenk på layouter som WordPress-malingssider. De definerer hvordan innholdet vises og hvordan det er merket. Akkurat som hvordan du kan opprette en ny sidemal i WordPress, kan du velge og lage et sidelayout i Frosk CMS. Hvis du for eksempel hadde to forskjellige statiske sider, og du ville ha helt forskjellige stiler og layouter mellom dem, ville du bare lage et nytt layout for en av dem og tildele den til den siden.
filer: filer er rett og slett hvor du kan finne noe som finnes i din offentlige / mappe av froskinstallasjonen. Ting som temaer og bilder.

Det skal dekke grunnleggende nok til at vi skal fortsette, så la oss gjøre det ...

Trinn 3: Legge til noe innhold

Gå videre og ta litt tid til å lage noen dummyartikler og fyllstoffer. Du kan bruke et nettsted som HTML-ipsum.com for å få litt filler innhold. Hvis du var lat og hoppet over delen ovenfor om å lage artikler, kan du bare navigere til baksiden, klikke på sider og klikke på det grønne ikonet ved siden av artikelsubsetet. Du kan nå publisere så mange artikler som du vil. Tre eller så skal gjøre for i dag.

Sidebarinnholdet er plassert under linken "Hjem" som er funnet under sider. Klikk på hjemmekoblingen, og du vil se en kategori som sier "Sidebar". Klikk på den kategorien, og du vil ha mulighet til å redigere eller endre alt sidebarinnhold du ønsker. Kort tid vil vi bruke en egendefinert utdrag i sidefeltet for å vise noen annonser for oss.

Trinn 4: Opprette noen brødsmuler!

En veldig fin funksjon å ha på noen blogg eller nettside er en breadcrumb navigasjon. Dette fjerner enhver forvirring brukeren kan ha, og lar dem vite hvor nøyaktig de er på nettstedet ditt. Heldigvis for oss trenger vi ikke å legge til mye kode i det hele tatt for å få en automatisk breadcrumb-navigasjon på hver side. Vi trenger ikke engang et plugin!

Naviger til baksiden av Frog CMS admin panel, og klikk på 'Snippets'.
Her finner du minst to utdrag, overskrift og bunntekst. Klikk på toppteknappen for å åpne den for redigering.
Bare legg til følgende kode ekko $ this-> breadcrumbs (); mellom noen php-koder, uansett hvor du ønsker, at breadcrumbs skal dukke opp. Se nedenfor for to eksempel skjermbilder.

Bildet ovenfor: legger til vår breadcrumb-kode til "header" -biten.

Bildet ovenfor: vår breadcrumb kode i aksjon, fungerer som forventet.

Du kan også sende et separatorargument til breadcrumbs () -metoden hvis du vil ha en annen separator. Og det er alt som trengs for å få en fungerende breadcrumb-navigasjon på Frosk CMS-installasjonen.

Trinn 5: Legge til utdrag for annonser

Som vi har snakket om tidligere, er utdrag bra for korte innholdstyper som skal inkluderes i hele nettstedet eller bloggen din. Si at vi vil ha noen ThemeForest og AudioJungle annonsering på vår nettside. Først kan vi navigere til ThemeForest tjene penger siden der vi kan laste ned noen 125 med 125 grafikk for å bruke for annonser. Last opp grafikken til froskinstallasjonen din under den offentlige / bilder katalogen.

Nå kan vi gå videre og lage vår utdrag. Naviger til utklippsseksjonen i administrasjonspanelet og opprett en ny kutt som heter sidebar_ads. Lim inn eller skriv inn følgende oppføring:

Selvfølgelig kan du legge til hvilken som helst annonse du ønsker, dette er bare for demoformål. Nå skal vi inkludere våre utdrag der vi vil at de skal dukke opp på nettstedet vårt. Tydeligvis kommer disse til å gå i vår sidefelt. Naviger til «sider» -delen i administrasjonspanelet. Klikk på linken "Hjem" (eller i min tilfelle "Fun with ze frog!" -Linken, da jeg endret navnene på hjemme-linken). Når du har klikket på Hjem-linken, klikker du på kategorien Sidebar.

Lim inn følgende kode og markering nå hvor du vil at annonsene dine skal vises i sidefeltet:

 
sponsorer
  includeSnippet ( 'sidebar_ads'); ?>

Du vil legge merke til at vi har pakket inn vårt kodestykke i en grunnleggende div-klasse, dette er å tillate noen grunnleggende styling, for eksempel å fjerne listestypen på annonsene. Legg til hva som helst CSS-markup du vil ha, og du har nettopp tatt med annonsene dine på hver side via sidebjelken og utdragene dine. Den gode tingen om snippets er at du kan bruke så mange som du liker hvor du trenger dem gjennom hele nettstedet ditt.

Trinn 6: Opprette et nettstedsside for enkel navigering

På mange nettsteder og blogger er det praktisk å gi brukerne en organisert nettstedskartsside slik at de enkelt kan bla gjennom informasjonen de leter etter. Frosken CMS gjør det veldig enkelt for oss å gjøre dette.

Først må vi opprette et nytt utdragsbetegnelse sitemap og lim inn følgende kode i koden:

 barn (); hvis (count ($ childs)> 0) $ out = ''; foreach ($ childs som $ barn) $ out. = ''. $ Barne-> link (). Snippet_sitemap ($ barn).
'; $ ut. = '
';  returnere $ ut; ?>  finne('/')); ?>

Opprett nå en ny side under "Hjem" -linken ved å klikke på det grønne ikonet til høyre. Gi navnet navnet uansett, og ta med koden vi opprettet over slik som:

 includeSnippet ( 'sidekart'); ?>

Gratulerer, du har nettopp opprettet en organisert og strukturert nettstedsside på omtrent 30 sekunder. Du bør ende opp som ser noe ut som skjermbildet nedenfor:

Hvis du ikke vil at den faktiske sidekartsiden skal inkluderes i sitemapet, kan du sette siden til "skjult" mens du publiserer den.

Bonus: Fjerne? Fra nettadressen

Du har kanskje lagt merke til spørsmålet som er inkludert på enkelte deler av nettadressen din i froskinstallasjonen. Personlig bryter det meg ikke mye, men hvis du ønsker å bli kvitt dem, har Frosk allerede tenkt på en enkel løsning. Følg trinnene nedenfor:

Åpne opp _.htaccess filen ligger i roten til froskinstallasjonen din.
Endre RewriteBase til plasseringen av Frosk CMS-installasjonen din (ie / frog_cms /). Skjermbilder nedenfor.
Lagre og endre navn på filen .htaccess
Åpne konfigur.php-filen og endre USE_MOD_REWRITE-verdien til ekte. Lagre og du er ferdig.

Bildet ovenfor: redigering av _.htaccess-filen til vår installasjonsbane.

Bildet ovenfor: redigerer config.php filen.

For mer informasjon om hvordan du fjerner? Merk, eller hvis du har problemer, se brukerhåndboken om dette emnet.

Vårt siste produkt

Med disse grunnleggende trinnene på plass, var vi i stand til å lage en svært grunnleggende blogg på ingen tid i det hele tatt. Du kan sjekke ut den endelige demoen til denne opplæringen her.

Ønsker mer?

Jeg må si at i forberedelsene til denne opplæringen var jeg ganske imponert av Frosk CMS-systemet. Hva synes dere alle? Ønsker du å se flere froskopplæringer i fremtiden, kanskje om temaene i temaer? Hva er dine inntrykk av From CMS generelt? Gi oss beskjed i kommentarfeltet!

Denne artikkelen ble opprinnelig lagt ut på ThemeForest-bloggen. Vi leverer nå over noen av de mer populære artiklene til Nettuts+.

Kode