Reference za programere

Sustav BizzyBeeShop Vam omogućuje (ili Vašem web developeru) izmjenu grafičkog dizajna Vaše web trgovine. Također vam omogućuje izmjenu postojećih funkcionalnosti ili dodavanje novih funkcionalnosti vašem web shopu.
Ako ste upoznati s tehnologijama kao što su HTML, CSS, JavaScript, JQuery - možete postići nevjerojatne rezultate.
Pokazat ćemo vam kako to učiniti. Pokazat ćemo vam primjere videa. Čak ćemo vam dati i uzorke isječaka koda koje smo koristili u našim demonstracijama, kao i kod koji smo koristili u stvarnim, živim produkcijskim webovima.

Sadržaj

Upravljanje s više trgovaca i webova
Custom CSS
Umetanje Custom koda u BizzyBeeShop templejt (predložak)
Programiranje sa punim pristupom HTML/CSS/JS kodu
Dodatak 1 – Definicije CUSTOMCODE snippeta

Logiranje u Green Panel

U svom web pregledniku otvorite poveznicu na Green Panel koju ste dobili na svoju e-poštu kada ste kreirali svoju web trgovinu.
Login screen img
Prijavite se u sustav sa svojim korisničkim imenom i lozinkom koje ste dobili na e-mail. Odaberite „Zapamti prijavu“ kako bi vas sustav mogao zapamtiti u budućnosti.
Nakon uspješne prijave, dobili ste pristup sustavu Green Panel, gdje možete obavljati sve poslove upravljanja Vašim webshopom.

Upravljanje s više trgovaca i webova

Obično, kada otvorite novog trgovca i prvu web trgovinu, dobivate svoje korisničko ime i lozinku za Green Panel.
Ako ste programer, web dizajner ili SEO stručnjak… radite za nekoliko trgovaca u sustavu BizzyBeeShop, možete dobiti jedinstveni pristup za nekoliko trgovaca sa svojim jedinstvenim korisničkim imenom/lozinkom.
Ova se značajka naziva Multi-Merchant admin. Da biste postali administrator za više trgovaca, kontaktirajte našu podršku i zatražite pristup jednom računu za više trgovaca za više trgovaca.

nazad na sadržaj

Custom CSS

Ako znate nešto o HTML/CSS tehnologijama, lako možete redizajnirati svoj BizzyBeeShop predložak.
Ovisno o dubini vašeg znanja, možete napraviti male ili vrlo velike promjene dizajna.
Svaka CSS klasa u predlošku BizzyBeeShop može se pre-pisati (override) vašom prilagođenom deklaracijom za poništavanje CSS-a.
Svaki web shop mora imati svoju CSS prilagođenu deklaraciju.

Kako to postići, predstavljeno je u sljedećem YouTube videu.
Video upućuje na primjer kako potpuno modificirati ELEGANCE skin prilagođenim dizajnom.

Kod i datoteke korištene u ovom primjeru:

Molimo obratite pažnju Implementacija lošeg CSS koda u Custom CSS editoru može ozbiljno upropastiti dizajn vašeg web shopa.
Stoga, zamolite stručnog web programera sa znanjem CSS-a da vam u tome pomogne.

nazad na sadržaj

Umetanje Custom koda u BizzyBeeShop templejt (predložak)

BizzyBeeShop predlošci sadrže određena, unaprijed definirana područja u koja možete umetnuti svoj prilagođeni kod.
Ovaj prilagođeni kod može biti bilo koji HTML, CSS, JavaScript, JQuery kod koji se može izvoditi na strani klijenta. Ne možete umetnuti kod na strani poslužitelja.
Za upravljanje svojim web trgovinama koristite menu-opciju Web Postavke u Green Panel sustavu.

Kako koristiti Custom code snippete predstavljeno je u našem YouTube videu:

Kod korišten u ovom primjeru:

Definicija regija Custom code snippeta i kako ih koristiti možete pronaći u Dodatak 1 – Definicije CUSTOMCODE snippeta.

Molimo obratite pažnju: Implementacija loših skripti i koda u Custom code snippetima može ozbiljno upropastiti dizajn i funkcionalnost vašeg web shopa.
Stoga, zamolite iskusnog web programera sa znanjem o HTML-u i JavaScriptu da vam pomogne u tome.
Da biste mogli pisati i implementirati Custom code snippete, morate biti uključeni u Green Panel Rolu Web developera. Kontaktirajte nas za to.

nazad na sadržaj

Programiranje sa punim pristupom HTML/CSS/JS kodu

Sustav BizzyBeeShop razvili smo tako da je kod aplikacije potpuno odvojen od koda web dizajna. To daje priliku web dizajnerima da rade samo na HTML/CSS/JS kodu, bez potrebe dublje kopati u C# kod na strani poslužitelja.
Svakom web shopu dodijeljen je svoj Skin. Skin je grafički predložak koji već radi i potpuno je dizajniran. Bez Skina niti jedan webshop ne može raditi.
Skin se sastoji od nekoliko vrsta datoteka:

.ASCX kontrole – sadrže običan HTML, kao i poslužiteljske kontrole koje će generirati izlazni HTML
.CSS – CSS datoteke
.JS – JavaScript datoteke
.PNG, .JPG, .SVG... – slike koje sadrže web grafiku za web shop

Ako vi, kao web programer, ne smatrate da je izrada Custom CSS-a ili korištenje Custom code snippeta dovoljna za vas – tada biste mogli biti zainteresirani za potpuni pristup kodu Skina. Na taj način ćete moći izraditi kompletan web dizajn i funkcionalnosti koje želite.
Ovim načinom rada možete napraviti sjajne web stranice. Web trgovine kao ove, napravljene su s čistom modifikacijom Skina: www.se-mark.hr, www.sport-moda.hr, shop.zel-cos.hr, www.sudoper.hr, www.pet-centar.hr, www.maxi-pet.ro. www.dobarpartner.hr. Ima ih mnogo više.

Kako razviti svoj web shop s punim pristupom Skin kodu prikazano je u ovom videu:

ASP.NET

Danas na webu postoji mnogo platformi za razvoj aplikacija. Platforma BizzyBeeShop temelji se na Microsoft ASP.NET© tehnologiji. Skin koristi mnoge kontrole na strani ASP.NET poslužitelja za renderiranje svog HTML sadržaja. Programer koji planira graditi web shop rješenja, temeljena na platformi BizzyBeeShop trebao bi se upoznati s ASP.NET kontrolama; kako su definirane, korištene i najvažnije – kako će one generirati HTML. Najbolji način da dobijete Reference za ASP.NET kontrole je ovdje:
https://docs.microsoft.com/en-us/troubleshoot/aspnet/server-controls
Programer neće morati stvarati nove ASP.NET kontrole, pa čak ni mijenjati postojeće ASP.NET kontrole. Iako i to može.
Međutim, programer bi trebao biti jako upoznat s načinom na koji će ove ASP.NET kontrole generirati HTML kod na kraju. Zato predlažemo da se upoznate s ASP.NET kontrolama.

VS.NET

Možete koristiti bilo koji HTML alat za kodiranje za izmjenu datoteka Skina. Međutim, preporučujemo Microsoftov izvorni razvojni alat - Visual Studio code.
Ovdje ga možete besplatno preuzeti: https://code.visualstudio.com/.

Partnerski program za programere i certifikat razvojnog programera BizzyBeeShop

Kako bismo bili sigurni da ćete dobiti pravu podršku s razvojem Skinova, gradimo BizzyBeeShop partnerski program. Partnerski program će vam dati:

Pristup internom razvojnom okruženju BizzyBeeShop sustava
Edukaciju za početak razvoja Skinova webshopa
Podršku u procesu razvoja Skinova
Pristup mnogim drugim resursima koje možete koristiti kao primjer u svojim web projektima

Partnerski program za razvojne programere namijenjen je stručnjacima vještim u tehnologijama kao što su HTML, CSS, JavaScript i jQuery. Poznavanje ASP.NET poslužiteljskih kontrola nije potrebno, ali je dobrodošlo.
BizzyBeeShop Developeri primarni su Frontend programeri. Nema potrebe i nema mogućnosti za kodiranje, izgradnju ili modificiranje koda na strani poslužitelja ili Back-end koda.

Partnerski program namijenjen je programerima koji će blisko surađivati s BizzyBeeShopom kako bi svojim klijentima pružili kvalitetne eCommerce projekte. Programeri će dobiti pristup resursima tvrtke kao što je razvojno okruženje za početak rada i isporuku projekata.
We want our Developer partners to earn money on quality projects by-themselves. BizzyBeeShop will provide the support needed.

Programeri nas mogu kontaktirati radi upisa u naš partnerski program, jednostavnim slanjem e-maila na info@bizzybeeshop.com. Najbolji način da započnete razgovor je slanjem nekoliko referentnih projekata na kojima ste radili u prošlosti. Mi ćemo ih pogledati.
Programeri tada mogu dobiti 30-dnevni probni pristup razvojnoj platformi. U svom razvojnom okruženju možete dobiti jedan Skin za testiranje i rad. Vi birate Skin. Nakon 30 dana izgradnje i testiranja, BizzyBeeShop će ocijeniti vaš rad. Programeri koji su u stanju dobro raditi na razvoju Skinova će dobiti BizzyBeeShop Certified Developer certificate i trajniji pristup svim njihovim budućim projektima e-trgovine.

nazad na sadržaj

Dodatak 1 – Definicije CUSTOMCODE snippeta

CUSTOMCODE_header	Header je kontrola koja se nalazi na vrhu svih webshop stranica na kojima možete pregledavati proizvode, čitati Novosti i slično. Kontrola Headera nije postavljena u stranice Checkout sekcije. CUSTOMCODE_header je PlaceHolder za vaš kod koji će se postaviti odmah nakon zatvaranja </header> taga.
CUSTOMCODE_header__add_to_header	Ovaj je PlaceHolder također smješten u Header kontrolu. Međutim, postavljanje unutar Header kontrole nije toliko važno. Sve što postavite u ovaj PlaceHolder, biti će postavljeno unutar <head></head> taga stranice.
CUSTOMCODE_footer	Footer je kontrola koja je postavljena blizu donjeg djela svih stranica webshopa na kojima možete pregledavati proizvode, čitati Novosti i slično. Footer kontrola nije postavljena u stranice Checkout sekcije. CUSTOMCODE_footer je PlaceHolder za vaš kod koji će se postaviti odmah nakon zatvaranja </footer> taga.
CUSTOMCODE_header_links_right	Webshop sadrži Header linkove. Možete bilo koje od njih pokazati ili sakriti. Isto tako, možete dodati bilo koji novi sadržaj, kao <a> tagove ili slično, s desne strane već postojećih linkova.
CUSTOMCODE_footer_links_right	Webshop sadrži Footer linkove. Možete bilo koje od njih pokazati ili sakriti. Isto tako, možete dodati bilo koji novi sadržaj, kao <a> tagove ili slično, s desne strane već postojećih linkova.
CUSTOMCODE_product_detail2	Ovaj code snippet pojavljuje se samo na Product-detail stranicama. Renderirati će kod odmah nakon završenog </main> taga.
CUSTOMCODE_product_list2custom_list	Ovaj code snippet will pojavljuje se samo na stranicama Izdvojenih lista proizvoda, kao što su Akcija, Novi proizvodi.
CUSTOMCODE_product_list2products	Ovaj code snippet pojaviti će se na stranicama s Listama proizvoda. Liste proizvoda su stranice koje se prikazuju kada korisnik prolazi kroz kategorije proizvoda.
CUSTOMCODE_patches__product_detail2_main	Ovaj code snippet se prikazuje nakon postojeće tri Oznake, na stranici Detalja proizvoda. Možete definirati sami svoje Oznake i generirati CSS kod koji će im omogućiti da funkcioniraju u skladu s podacima Oznaka koje ste postaviti u proizvodu unutar Green Panela.
CUSTOMCODE_patches__product_detail2_related	Ovaj code snippet se prikazuje nakon postojeće tri Oznake, na stranici Detalja proizvoda, ali u sekciji gdje se pojavljuju Povezani proizvodi. Renderiraju se za svaki od povezanih proizvoda. Možete definirati sami svoje Oznake i generirati CSS kod koji će im omogućiti da funkcioniraju u skladu s podacima Oznaka koje ste postaviti u proizvodu unutar Green Panela.
CUSTOMCODE_patches__product_list2products	Ovaj code snippet se prikazuje nakon postojeće tri Oznake, na stranici Lista proizvoda. Renderira se za svaki od proizvoda u listi.
CUSTOMCODE_patches__product_list2custom_list	Ovaj code snippet se prikazuje nakon postojeće tri Oznake, na stranici Izdvojenih lista proizvoda, dakle za posebne liste kao što je lista “Novi proizvodi”.
CUSTOMCODE_patches__product_list2homepage	Ovaj code snippet se prikazuje nakon postojeće tri Oznake, na proizvodima na Početnoj stranici (Homepage).
CUSTOMCODE_checkout__UserData	Ovaj code snippet se prikazuje odmah prije zatvaranja </main> taga na stranicama Checkout procesa, gdje korisnik upisuje svoje osobne podatke.
CUSTOMCODE_checkout__ShippingData	Ovaj code snippet se prikazuje odmah prije zatvaranja </main> taga na stranicama Checkout procesa, gdje korisnik odabire metodu Dostave.
CUSTOMCODE_checkout__PaymentData	Ovaj code snippet se prikazuje odmah prije zatvaranja </main> taga na stranicama Checkout procesa, gdje korisnik odabite metodu Plaćanja.
CUSTOMCODE_checkout__ConfirmOrder	Ovaj code snippet se prikazuje odmah prije zatvaranja </main> taga na stranicama Checkout procesa, na stranici "Potvrde narudžbe".
CUSTOMCODE_checkout__CreditCardData	Ovaj code snippet se renderira odmah prije zatvaranja </main> taga na stranicama Checkout procesa gdje korisnik upisuje podatke svoje Kreditne kartice. Molimo budite svjesni: Iako ovaj snippet postoji, on je uvijek za vas Read-Only. Trenutno, ukoliko trebate postaviti neku logiku na ovu stranicu - slobodno pošaljite nama dotičnu skriptu. Mi ćemo je pregledati, i postaviti je nakon što se uvjerimo da je sigurna. Na toj se stranici ipak unose brojevi kreditnih kartica!
CUSTOMCODE_checkout__ThankYou	Ovaj code snippet se renderira odmah prije zatvaranja </main> taga na Hvala stranici (ThankYou page).

nazad na sadržaj