SlideShare a Scribd company logo
Razvoj web sajta pomoću
CMS alata WordPress
Prof. dr Angelina Njeguš
Vanredni profesor
Niš, mart 2015.
Agenda
 Šta je CMS?
 Šta je važnije sadržaj ili dizajn?
 Osnove WordPress-a
 Registracija
 Kreiranje web strane
 Kreiranje web posta
Šta je CMS?
 CMS - Content Management System
 Informacioni sistem koji omogućava upravljanje
sadržajem web sajta
Šta je važnije sadržaj ili dizajn?
 Dobar dizajn privlači, ali dobar sadržaj zadržava!
 Dizajn i sadržaj treba da šalju istu poruku!
 Dizajn i pisani sadržaj su ključni faktori u sticanju
bolje pozicije kod pretraživača!
 Web sajt je živa predstava i zahteva održavanje!
Šta je važnije sadržaj ili dizajn?
 Web dizajn i sadržaj su podjednako važni za
uspešan razvoj i predstavljanje web sajta!
CMS role
Top 3 CMS alata
Uvod u WordPress
 Open source
 Dobro pozicioniran kod
pretraživača
 Nije samo platforma za
blogovanje!
 Puno funkcionalnosti koje
omogućavaju razvoj
ozbiljnog eCommerce sajta!
Osnove WordPress-a
 WordPress je izgrađen oko dva osnovna koncepta:
 Pages – web strana sa statičnim sadržajem, koji se ne menja često, na
primer strana „O nama“
 Posts – postovi se prikazuju hronološkim redom, na primer posts
„Vesti“
Registracija
https://wordpress.com/
Registracija
 Ukucajte spojeno vaše ime i prezime i godinu rođenja
Registracija
 Unesite vašu validnu
email adresu
 Unesite željene parametre
za logovanje na sajt
WordPress-a
 Odaberite username
 Odaberite željenu šifru
Registracija
Kliknite na
No Thanks!
Registracija
 Odaberite besplatne teme za dizajn vašeg sajta
Aktivirajte nalog
 Otvorite vaš email i kliknite na Activate Account!
Dobro došli u WordPress!
 Kliknite na WP Admin!
Odaberite željenu temu!
 Kliknite na Appearance, a zatim na Themes!
Odabir teme
 Kliknite na Free
 Odaberite Wilson temu i kliknite na Activate ili Preview
Kreiranje Web strane!
 Kliknite na Pages, a zatim na
Add New!
Napomena:
 Po difoltu su vam kreirane jedna strana
About i jedan post Home!
Kreiranje web strane
 Naslov strane: Welcome
 Tekst:
 Obojite reči Univerzitet
Singidunum drugom bojom
Značenje menija
Unos teksta i videa
 Ubacite video
 Pretražite na YouTube-u željeni video
 Kliknite na Share i kopirajte link
 Kliknite na Text Editor i postavite link
 Kreirajte hiperlink
 Otkucajte tekst: Posetite naš sajt www.singidunum.ac.rs
 Selektujte adresu sajta i kliknite na ikonu za hiperlink
 Unesite adresu:
Pregled unetog sadržaja
 Kliknite na Publish, a zatim Preview
Ažuriranje postojeće
strane
 Otvorite postojeću stranu: About
 Promenite naziv u: Kontakt
 Kucajte u Text editoru sledeći tekst:
<h5 style="background-color: lightgrey;">Adresa:</h5>
Singidunum Univerzitet
Centar Niš
Nikole Pašića 28
18000 Niš
Srbija
<h5 style="background-color: lightgrey;">Pronađite nas::</h5>
Ugrađivanje mape
 Koraci dodavanja Google mape na stranu:
 Idite na sajt maps.google.com
 Ukucajte adresu: Nikole Pašića 28, Niš
 Kliknite na Settings
Ugrađivanje mape
(nastavak)
 Kliknite na Share or Embed Map
 Odaberite karticu Embed Map
 Odaberite mapu manje veličine:
Small
 Kopirajte link
 U produžetku teksta (Text Editor)
postavite (Paste) kopirani link
Ubacivanje kontakt forme
 U nastavku teksta (i dalje pod Text editor-om) kucajte:
<h5 style="background-color: lightgrey;">Kontaktirajte nas:</h5>
Tel: 018/208300
e-mail: centarnis@singidunum.ac.rs
<h5 style="background-color: lightgrey;">Ukoliko želite možete popuniti i donji obrazac i mi
ćemo vas kontaktirati:</h5>
 Pređite na Visual Editor i kliknite na Add Contact Form
Ubacivanje kontakt forme
 Izmenite postojeća polja:
 Umesto Name stavite Ime
(prethodno kliknite na Edit)
 Dodajte novo polje klikom
na Add a new field koje
ćete nazvati Prezime (tip
polja je Text i čekirajte
Required) i klikom na
Move pomeriti do ispod
imena
 Dodajte novo polje
Zanimanje (tip polja je
Drop down), a nazivi opcija
su: Profesor, Student,
Radnik, Đak (ne mora da
bude obavezno polje)
Uređivanje kontakt forme
 Kliknite na Email Notifications
 Unesite željeni email, na koji će stizati sadržaji kontakt forme
Finalni izgled kontakt
forme
Kreiranje posta
 Pre nego što napravite svoj prvi post potrebno je da kreirate:
 Kategorije – služe za organizaciju postova. Neki postovi mogu imati
svoje nadređene (Parent) kategorije. Na primer, Kursevi i Konferencije
mogu podređeni kategoriji Događaji.
 Tagove – omogućavaju brže pronalaženje određenog sadržaja, lakšu
navigaciju i pomažu pretraživačima da razumeju sadržaj vašeg sajta.
Kreiranje kategorija
 Kliknite na Posts, a zatim na Categories
Izmena postojećeg posta
 Kliknite na Posts i odaberite All Posts
 Među postojećim se nalazi jedan post Hello World!
 Umesto difoltnog teksta otkucajte sledeće i ubacite sliku:
 Odaberite kategoriju: Događaji (sa krajnje desne strane)
Ubacivanje slike
 Odaberite slike (poželjno većeg formata) i sačuvajte na
Desktopu
 Kliknite na Add Media
 Upload Files
 Prevucite ili kliknite na Select File i pronađite sa Desktopa vašu sliku
 Kliknite Insert into Post
Ubacivanje ankete (Poll)
 Kliknite na Add Poll
Kreiranje novog posta
 Kliknite na Posts, a zatim na Add New
 Naslov: Praksa
 Nakon ukucanog prvog pasusa, kliknite
na Insert read more tag, kako bi se
tekst prelomio:
 Ubacite Featured Image (sa krajnje
donje desne strane)
 Selektujte kategorije Događaji i Praksa
 Kreirajte tagove: praksa, đaci
Izgled posta
Kreiranje menija
 Appearance – Menus
 Kreirati meni pod nazivom GlavniMeni, a zatim dodati kreirane strane i kategorije
Ubacivanje dodataka
(Widgets)
 Appearance – Widgets
 Dodati Kalendar: kliknuti na Calendar i prevući mišem do
Sidebar. Dati naslov (Title) Kalendar događaja
 Dodati meni: kliknuti na Custom Menu i prevući do
Footer 1
 Dodati pretragu: kliknuti na Search i prevući do Sidebar
 Dodati prikaz najkorišćenijih i traženih tagova: Tag Cloud
i prevući do Sidebar
 Dodati fiksni tekst: Text prevući do Sidebar i uneti naslov
Student u centru učenja, a u okviru sadržaja Kontakt
telefon i email.
 Dodati sliku: Image prevući do Sidebar. Dodati link na
sliku.
Podešavanja
Settings
 Opšta podešavanja: Settings - General
 Site title: modifikovati naziv sajta
 Biranje Home stranice: Settings – Reading
 Front page display: Your latest posts ili A static page
Prof. dr Angelina Njeguš
E-mail: anjegus@singidunum.ac.rs

More Related Content

PPT
Slideshare U Tri Koraka
PPTX
WordPress Delicije
PPTX
Human Resource and Information Systems
PPTX
IT veštine - Dani maturanata feb 2015
PPTX
Lesson 11 Amadeus Hotels
PPTX
Lesson 8 Basic PNR
PPTX
Lesson 08 WordPress part 2
PPTX
Lesson 07 WordPress part 1
Slideshare U Tri Koraka
WordPress Delicije
Human Resource and Information Systems
IT veštine - Dani maturanata feb 2015
Lesson 11 Amadeus Hotels
Lesson 8 Basic PNR
Lesson 08 WordPress part 2
Lesson 07 WordPress part 1

Viewers also liked (20)

PPTX
IT trendovi u 2017-oj
PPTX
Lesson 12 Amadeus Cars
PPTX
Lesson 10 Fare Quote
PPTX
IT business model for tourism product placement
PPTX
Lesson 5 Intro to Amadeus hands-on labs
PPT
Amadeus general knowledge
PPTX
Lesson 9 Optional PNR elements
PPTX
Lesson 7 Amadeus AIR
PPTX
Basic Passenger Tariff Training
PPTX
Lesson 4 Introduction to Amadeus
PPT
Amadeus PPT
PPT
GDS Systems Overview
PPTX
Lesson 06 Content Management Systems
PPSX
Aviation Basic ( Res & Ticketing )
PPTX
Lesson 6 Conversion Functions
PPTX
Building fare Calculation_PPT_BY FADIL
PDF
Lesson 2: e-Business Systems in Tourism
PPT
Airline fares
PDF
Lesson 3: From Computer Reservation Systems to Global Distribution Systems
PPT
Ticket and airline terms (Airport matters)
IT trendovi u 2017-oj
Lesson 12 Amadeus Cars
Lesson 10 Fare Quote
IT business model for tourism product placement
Lesson 5 Intro to Amadeus hands-on labs
Amadeus general knowledge
Lesson 9 Optional PNR elements
Lesson 7 Amadeus AIR
Basic Passenger Tariff Training
Lesson 4 Introduction to Amadeus
Amadeus PPT
GDS Systems Overview
Lesson 06 Content Management Systems
Aviation Basic ( Res & Ticketing )
Lesson 6 Conversion Functions
Building fare Calculation_PPT_BY FADIL
Lesson 2: e-Business Systems in Tourism
Airline fares
Lesson 3: From Computer Reservation Systems to Global Distribution Systems
Ticket and airline terms (Airport matters)
Ad

Similar to Praksa WordPress (6)

PDF
Ppt na wp blogu (2013)
PPTX
Radionica 3
PPT
Kreiranje sajta pomocu servisa Weebly
PPTX
Informaticka aktualizacija seminar
PPTX
Pisanje prvog clanka (2013)
Ppt na wp blogu (2013)
Radionica 3
Kreiranje sajta pomocu servisa Weebly
Informaticka aktualizacija seminar
Pisanje prvog clanka (2013)
Ad

More from Angelina Njegus (6)

PPTX
Kognitivno računarstvo u turizmu
PPTX
The impact of artificial intelligence on the tourism industry
PPTX
BI Competence Center & Data Governance
PPTX
Business Intelligence Strategies and its role in corporate development
PPTX
Lesson 01 Introduction to e-tourism
PDF
Lesson 1: Foundations of Information Systems
Kognitivno računarstvo u turizmu
The impact of artificial intelligence on the tourism industry
BI Competence Center & Data Governance
Business Intelligence Strategies and its role in corporate development
Lesson 01 Introduction to e-tourism
Lesson 1: Foundations of Information Systems

Praksa WordPress

  • 1. Razvoj web sajta pomoću CMS alata WordPress Prof. dr Angelina Njeguš Vanredni profesor Niš, mart 2015.
  • 2. Agenda  Šta je CMS?  Šta je važnije sadržaj ili dizajn?  Osnove WordPress-a  Registracija  Kreiranje web strane  Kreiranje web posta
  • 3. Šta je CMS?  CMS - Content Management System  Informacioni sistem koji omogućava upravljanje sadržajem web sajta
  • 4. Šta je važnije sadržaj ili dizajn?  Dobar dizajn privlači, ali dobar sadržaj zadržava!  Dizajn i sadržaj treba da šalju istu poruku!  Dizajn i pisani sadržaj su ključni faktori u sticanju bolje pozicije kod pretraživača!  Web sajt je živa predstava i zahteva održavanje!
  • 5. Šta je važnije sadržaj ili dizajn?  Web dizajn i sadržaj su podjednako važni za uspešan razvoj i predstavljanje web sajta!
  • 7. Top 3 CMS alata
  • 8. Uvod u WordPress  Open source  Dobro pozicioniran kod pretraživača  Nije samo platforma za blogovanje!  Puno funkcionalnosti koje omogućavaju razvoj ozbiljnog eCommerce sajta!
  • 9. Osnove WordPress-a  WordPress je izgrađen oko dva osnovna koncepta:  Pages – web strana sa statičnim sadržajem, koji se ne menja često, na primer strana „O nama“  Posts – postovi se prikazuju hronološkim redom, na primer posts „Vesti“
  • 11. Registracija  Ukucajte spojeno vaše ime i prezime i godinu rođenja
  • 12. Registracija  Unesite vašu validnu email adresu  Unesite željene parametre za logovanje na sajt WordPress-a  Odaberite username  Odaberite željenu šifru
  • 14. Registracija  Odaberite besplatne teme za dizajn vašeg sajta
  • 15. Aktivirajte nalog  Otvorite vaš email i kliknite na Activate Account!
  • 16. Dobro došli u WordPress!  Kliknite na WP Admin!
  • 17. Odaberite željenu temu!  Kliknite na Appearance, a zatim na Themes!
  • 18. Odabir teme  Kliknite na Free  Odaberite Wilson temu i kliknite na Activate ili Preview
  • 19. Kreiranje Web strane!  Kliknite na Pages, a zatim na Add New! Napomena:  Po difoltu su vam kreirane jedna strana About i jedan post Home!
  • 20. Kreiranje web strane  Naslov strane: Welcome  Tekst:  Obojite reči Univerzitet Singidunum drugom bojom
  • 22. Unos teksta i videa  Ubacite video  Pretražite na YouTube-u željeni video  Kliknite na Share i kopirajte link  Kliknite na Text Editor i postavite link  Kreirajte hiperlink  Otkucajte tekst: Posetite naš sajt www.singidunum.ac.rs  Selektujte adresu sajta i kliknite na ikonu za hiperlink  Unesite adresu:
  • 23. Pregled unetog sadržaja  Kliknite na Publish, a zatim Preview
  • 24. Ažuriranje postojeće strane  Otvorite postojeću stranu: About  Promenite naziv u: Kontakt  Kucajte u Text editoru sledeći tekst: <h5 style="background-color: lightgrey;">Adresa:</h5> Singidunum Univerzitet Centar Niš Nikole Pašića 28 18000 Niš Srbija <h5 style="background-color: lightgrey;">Pronađite nas::</h5>
  • 25. Ugrađivanje mape  Koraci dodavanja Google mape na stranu:  Idite na sajt maps.google.com  Ukucajte adresu: Nikole Pašića 28, Niš  Kliknite na Settings
  • 26. Ugrađivanje mape (nastavak)  Kliknite na Share or Embed Map  Odaberite karticu Embed Map  Odaberite mapu manje veličine: Small  Kopirajte link  U produžetku teksta (Text Editor) postavite (Paste) kopirani link
  • 27. Ubacivanje kontakt forme  U nastavku teksta (i dalje pod Text editor-om) kucajte: <h5 style="background-color: lightgrey;">Kontaktirajte nas:</h5> Tel: 018/208300 e-mail: centarnis@singidunum.ac.rs <h5 style="background-color: lightgrey;">Ukoliko želite možete popuniti i donji obrazac i mi ćemo vas kontaktirati:</h5>  Pređite na Visual Editor i kliknite na Add Contact Form
  • 28. Ubacivanje kontakt forme  Izmenite postojeća polja:  Umesto Name stavite Ime (prethodno kliknite na Edit)  Dodajte novo polje klikom na Add a new field koje ćete nazvati Prezime (tip polja je Text i čekirajte Required) i klikom na Move pomeriti do ispod imena  Dodajte novo polje Zanimanje (tip polja je Drop down), a nazivi opcija su: Profesor, Student, Radnik, Đak (ne mora da bude obavezno polje)
  • 29. Uređivanje kontakt forme  Kliknite na Email Notifications  Unesite željeni email, na koji će stizati sadržaji kontakt forme
  • 31. Kreiranje posta  Pre nego što napravite svoj prvi post potrebno je da kreirate:  Kategorije – služe za organizaciju postova. Neki postovi mogu imati svoje nadređene (Parent) kategorije. Na primer, Kursevi i Konferencije mogu podređeni kategoriji Događaji.  Tagove – omogućavaju brže pronalaženje određenog sadržaja, lakšu navigaciju i pomažu pretraživačima da razumeju sadržaj vašeg sajta.
  • 32. Kreiranje kategorija  Kliknite na Posts, a zatim na Categories
  • 33. Izmena postojećeg posta  Kliknite na Posts i odaberite All Posts  Među postojećim se nalazi jedan post Hello World!  Umesto difoltnog teksta otkucajte sledeće i ubacite sliku:  Odaberite kategoriju: Događaji (sa krajnje desne strane)
  • 34. Ubacivanje slike  Odaberite slike (poželjno većeg formata) i sačuvajte na Desktopu  Kliknite na Add Media  Upload Files  Prevucite ili kliknite na Select File i pronađite sa Desktopa vašu sliku  Kliknite Insert into Post
  • 35. Ubacivanje ankete (Poll)  Kliknite na Add Poll
  • 36. Kreiranje novog posta  Kliknite na Posts, a zatim na Add New  Naslov: Praksa  Nakon ukucanog prvog pasusa, kliknite na Insert read more tag, kako bi se tekst prelomio:  Ubacite Featured Image (sa krajnje donje desne strane)  Selektujte kategorije Događaji i Praksa  Kreirajte tagove: praksa, đaci
  • 38. Kreiranje menija  Appearance – Menus  Kreirati meni pod nazivom GlavniMeni, a zatim dodati kreirane strane i kategorije
  • 39. Ubacivanje dodataka (Widgets)  Appearance – Widgets  Dodati Kalendar: kliknuti na Calendar i prevući mišem do Sidebar. Dati naslov (Title) Kalendar događaja  Dodati meni: kliknuti na Custom Menu i prevući do Footer 1  Dodati pretragu: kliknuti na Search i prevući do Sidebar  Dodati prikaz najkorišćenijih i traženih tagova: Tag Cloud i prevući do Sidebar  Dodati fiksni tekst: Text prevući do Sidebar i uneti naslov Student u centru učenja, a u okviru sadržaja Kontakt telefon i email.  Dodati sliku: Image prevući do Sidebar. Dodati link na sliku.
  • 40. Podešavanja Settings  Opšta podešavanja: Settings - General  Site title: modifikovati naziv sajta  Biranje Home stranice: Settings – Reading  Front page display: Your latest posts ili A static page
  • 41. Prof. dr Angelina Njeguš E-mail: anjegus@singidunum.ac.rs