Etablere En Dreamweaver CC Og WordPress Arbeidsflyt

jeg vokste opp en kjemi nerd og fortsatt levende husker spenningen av sprinkling jern filing over min mini Bunsen brenner for å vise glitrende fyrverkeri. Tanken om at to elementer kunne kombinere til en så spektakulær effekt var tankegang for meg. Jeg opplevde den samme synaptiske gleden da jeg oppdaget Hvordan WordPress og Dreamweaver ble laget for hverandre.

WordPress Er, unektelig, den mest populære CMS i bruk i dag. Med brorparten av markedet (47.5% av de beste 10k-nettstedene, ifølge BuiltWith.com), stort utvalg av maler og plugin-moduler, For ikke å nevne en stadig utviklende brukervennlighet, Tilbyr WordPress en direkte rute til et bredt spekter av nettstedsdestinasjoner. Men hva om du ikke vil gå akkurat der En WordPress-mal sier at du burde? Hva om kunden din—eller din egen personlige designfølelse—krever en tilpasset tilstedeværelse på nettet? Så la meg introdusere deg til Den beste design-og kodingspartneren WordPress aldri visste at Den hadde: Dreamweaver CC.

jeg er en stor fan Av Dreamweaver / WordPress arbeidsflyt og har kombinert disse to elementære elektroverktøyene i årevis for å konstruere nettsteder for kunder som trenger innholdsstyringsfunksjoner sammen med et personlig utseende og følelse. Dreamweaver er, tror jeg, godt egnet til oppgaven, ikke bare som en designmotor for å perfeksjonere det fremre området, men også som et effektivt kodingsmiljø for å håndtere tilpassede, uunngåelig nødvendige PHP-funksjoner.

WordPress Fordel: Dreamweaver CC

Hva Bringer Dreamweaver til bordet som gjør Det så godt egnet Til WordPress-utvikling? Nøkkelen er kombinasjonen Av Live View og PHP-støtte. WordPress er ET PHP / MySQL-rammeverk, Og Dreamweavers evne til å behandle server-sidespråket er kritisk. Dreamweavers Live View utfører PHP-koden, integrerer MySQL-dataene, og viser UTDATAENE HTML5 og CSS 3-design med nettleserkompatibel presisjon—alt mens du holder alt interaktivt og redigerbart.

WordPress Er et utrolig komplekst templerende program som avhenger av nesten 100 inkluderte og sammenvevde separate filer for å generere en enkelt side. Hvordan vet jeg dette? Bare åpne en indeks.php-fil Fra En WordPress site root og gi Dreamweaver klarsignal til å oppdage dynamisk relaterte filer. DU vil snart se en rekke tilgjengelige filer—PHP, CSS, JavaScript og XML—på Toppen Av Dokumentvinduet i Verktøylinjen Relaterte Filer. Og Dreamweaver gir deg ikke bare tilgang til hver og en av Dem, men behandler dem alle og presenterer det gjengitte resultatet trofast. Veldig kraftig.

Filtrering for viktige filer

selvfølgelig kan tilgjengeligheten av et så stort antall filer være motproduktivt når du prøver å finpusse på akkurat RIKTIG CSS eller annen fil. Dreamweaver CC inneholder det perfekte verktøyet for målretting velge filer: Filter Relaterte Filer. Denne enkle funksjonen gjør det mulig å vise bare visse typer filer (SOM PHP eller JavaScript) eller individuelle filer. Jeg bruker rutinemessig Egendefinert Filteralternativ for denne funksjonen til å jobbe bare på temaets CSS -, indeks -, topp-og bunntekstsider, slik:

*.css; indeks.php;topptekst*; bunntekst*

https://blog.adobe.com/media_96f5f722920d6ba831d715073c8763583b6dfe1e.gif

når du angir Det Egendefinerte Filterfeltet i dialogboksen, vises bare filene jeg trenger—inkludert de i aktive temaer eller underordnede maler—på verktøylinjen relaterte filer. Nå kan jeg jobbe med kode I Split view, og en rask oppdatering viser oppdateringer I Live view.

Swift styling

Integrasjon med CSS er enda strammere, med endringer i DREAMWEAVERS CSS Designer panel trer i kraft umiddelbart. I tillegg til å tilby hele PALETTEN AV CSS-egenskaper, gir grensesnittet direkte tilgang til flere kilder, selv de som brukes i mediespørringer, slik at du kan være sikker på at du jobber med riktig CSS-fil.

https://blog.adobe.com/media_504fd2693d1ae75005819cc5acb5dcf82f56ed76.gif

Best av alt, det er ganske enkelt med den nylig utviklede Live view for å finne ut nøyaktig hvilke skjermområder eller elementer som må tas opp. Bare naviger til ønsket side ved Hjelp Av Følg Link-funksjonen, og aktiver Deretter Inspiser modus. Dreamweaver behandler WordPress-siden din feilfritt og fremhever deretter den tilsvarende CSS-velgeren og dens egenskaper for pek-og-klikk-modifikasjon. Mer dyptgående endringer er bare et høyreklikk unna når Du Går Til Kode.

WordPress spesifikk kode hinting

Når det Gjelder kode, i tillegg til den generelle kompatibiliteten med ALLE PHP-applikasjoner, Gir Dreamweaver CC også støtte for spesifikke WordPress-funksjoner. Fordi ikke alle prosjekter Er WordPress-nettsteder, er denne målrettede funksjonen aktivert på et nettsted for nettsted ved å velge Nettsted > Nettstedspesifikk Kodehinting. Den etterfølgende dialogen som åpnes, oppdager installasjonen din og velger Automatisk WordPress, så vel som den aktuelle koderoten. Ærlig, i de fleste scenarier, alt du trenger å gjøre er å kjøre kommandoen, åpne dialogboksen OG klikk OK: resten er automatisk. Nå, tips for Alle WordPress funksjoner, komplett med syntaks og kort beskrivelse pop-up som du kode.

http://blogs.adobe.com/creativecloud/files/2015/02/code-hint.png

Gjør deg klar for En Dreamweaver og WordPress arbeidsflyt

så hva tar det for å komme i gang med En Dreamweaver og WordPress? Overraskende lite. Her er de viktigste trinnene:

Sett Opp Apache, PHP Og MySQL

for å betjene WordPress riktig, trenger Du en lokal webserver (vanligvis Apache) sammen med Både MySQL og PHP-evner, kollektivt kjent som EN AMP-stabel.Det er to grunnleggende ruter du kan ta for å oppfylle dette kravet: separate komponenter vs programvarepakke. Installering og aktivering av separate komponenter (Apache server, MySQL, PHP og vanligvis et databasebehandlingsprogram som phpMyAdmin) tar lengre tid og krever mer teknisk kompetanse, men gir mer kontroll.Installere en programvarepakke som Mamp (Mac Og Windows) eller Wampserver (Bare Windows) er en one-stop, pek-og-klikk smuss-enkel prosess, men avstår detaljert system management.Lynda.com tilbyr et kurs som dekker HELE AMP waterfront og forfatter David Gassner leder deg gjennom hver av scenariene, komplett med feilsøking. (Hvis du ikke er en Lynda.com medlem, få 10 dager gratis for å se dette kurset og eventuelle andre, inkludert Mine Egne Dreamweaver / WordPress kurs.)

Opprett en database

Når utviklingsmiljøet ditt ruller sammen, må du opprette en database for WordPress-installasjonen-et snap med hvert databasebehandlingsprogram. Du kan navngi databasen hva du vil; jeg går vanligvis med noe klientbasert fordi jeg utvikler mange WordPress-nettsteder lokalt. Og databasen er alt du trenger: alle tabellene og skjemaet er laget for Deg under WordPress-installasjonen.

Definer Ditt Dreamweaver-nettsted

Ditt Dreamweaver-nettsted bør være i en mappe i din lokale nettrot, slik at Den kan bla gjennom via en http://localhost/ nettadresse. (Merk: avhengig Av Apache-serverens konfigurasjon, må du kanskje legge til et portnummer.). I tillegg kreves en testserver som spesifiserer den lokale webroten, samt EN PHP-servermodell.

Sett Opp WordPress på Dreamweaver-siden

jeg laster alltid ned den nyeste versjonen fra WordPress.org når du starter et prosjekt. Rammeverket er ofte oppdatert med både mindre (bug-fix-orientert) og store (forbedrede funksjoner) versjoner. Å holde seg oppdatert er spesielt viktig fra et sikkerhetssynspunkt i disse dager; WordPress-teamet er ganske årvåken i å styrke eventuelle oppfattede sårbarheter. Lagre innholdet i det nedlastede arkivet i Dreamweaver local site-mappen. Hvis nettstedet er Helt WordPress-drevet, legg filene i roten til katalogen; hvis du integrerer En WordPress-blogg i et nettsted, hold Alle WordPress-filene i sin egen mappe av nettstedroten.

Installer WordPress

selv om Det er her alt det faktiske arbeidet foregår, er installasjon Av WordPress kanskje det enkleste trinnet, takket være rammens insistering på en idiotsikker, no-brainer, lett-peasy tilnærming.Bare bla til nettstedets wp-admin mappe (med EN URL som http://localhost/ My_WP_DW_Site / wp-admin/) og du er av.WordPress vil oppdage mangelen på en konfigurasjonsfil og bekrefte at du vil opprette en. Når du gjør det, må du skrive inn noen kjerneinformasjon, som databasenavn og legitimasjon. Så, hvis du har fulgt de forrige trinnene riktig, vil du bli hilsen med en av de mest tilfredsstillende installasjonsmeldingene som er opprettet: «Ok Sparky!»Det får meg til å smile hver gang. Ett klikk og installasjonen er fullført: du er klar til å logge inn og begynne Å jobbe Med WordPress.På Dreamweaver-siden må Du sørge For At Du er I Live view og åpne WordPress-indeksen.php. BAM! Det er ditt Standard WordPress tema og eksempelinnlegg. Techno-abracadabra.

mulighetens verden avslørt

nå begynner den virkelige moroa når du begynner å utforske begge sider av arbeidsflyten: Dreamweaver Og WordPress. Og det er massevis du kan gjøre med begge, inkludert barnetemaer, plugin-moduler, tilpassede sider og til og med et personlig WordPress administrativt grensesnitt, Dashbordet. Dreamweaver CC kan håndtere alt fra CSS-design til PHP-funksjoner. Prøv det og se om det ikke setter av en kjemisk reaksjon av din egen.