Integrera UberGallery med OpenCart Del 1

UberGallery är ett enkelt PHP-skript som skapar ett fint webbgalleri genom att generera miniatyrbilder av de ursprungliga bilderna i flygningen. Du behöver bara ladda upp bilder till en viss katalog, och de kommer att hämtas för att generera fotogalleriet.

Vårt mål är att skapa en modul som använder UberGallery-skriptet för att skapa galleriet, men på ett OpenCart-sätt. I back-end ska du kunna konfigurera parametrar som miniatyrbredd, miniatyrhöjd och liknande. Baserat på det kommer det att skapa ett bildgalleri-block på frontsidans sidor.

Idag går vi igenom back-end-inställningen där vi skapar de filer som krävs för att skapa en anpassad konfigurationsblankett i modulen bakmodul. Jag antar att du är bekant med den grundläggande modulutvecklingsprocessen i OpenCart, eftersom vi kommer att hoppa över grunderna i modulens skapningssteg. Här är en bra artikel som förklarar grunderna i OpenCart-modulerna om du vill utforska den.

Jag antar att du använder den senaste versionen av OpenCart, så se till att du har den så att du kan följa kodproverna.

File Setup-i ett nötskal

Låt oss snabbt gå igenom den filinställning som krävs för back-end.

  • admin / styrenheten / modul / uber_gallery.php: Det är en kontrollerfil som tillhandahåller programlogiken hos den vanliga regulatorn i OpenCart.
  • admin / språk / engelska / modul / uber_gallery.php: Det är en språkfil som hjälper till att skapa språketiketter.
  • admin / view / mall / modul / uber_gallery.tpl: Det är en bildmallfil som innehåller XHTML i konfigurationsformuläret.
  • system / bibliotek / uberGallery: Det är själva UberGallery-komponenten.

Så det är en lista över de filer vi ska genomföra idag. Det skapar en anpassad konfigurationsform för vår UberGallery-modul så att du kan konfigurera de olika parametrarna från baksidan.

Utan att slösa bort någon gång, ska jag genast dyka in i de nudda sakerna.

Ställ in modulerna för back-end-modulen

Innan vi fortsätter och skapa våra anpassade modulfiler, ladda ner UberGallery från den officiella hemsidan och kopiera resurs katalog på ett sådant sätt att det ser ut system / biblioteket / uberGallery / resurser.

Skapa nu en fil system / bibliotek / uberGallery / resurser / oc.galleryConfig.ini med följande innehåll.

; Detta är standard UberGallery config-filen. Kopiera den här filen till galleryConfig.php; och ändra följande värden för att anpassa ditt galleri. [basic_settings] cache_expiration = [cache_expiration]; Cache-utgångstiden i minuter; Ange till -1 för permanent caching enable_pagination = true; Ange till "true" för att aktivera pagination paginator_threshold = 10; Maximalt antal sidor att visa; i pagatorn innan truncating thumbnail_width = [thumbnail_width]; Thumbnail bredd (i pixlar) thumbnail_height = [thumbnail_height]; Miniatyrhöjd (i pixlar) thumbnail_quality = [thumbnail_quality]; Miniatyrkvalitet från 1 till 100; Högre = bättre kvalitet / långsammare theme_name = uber-responsive; Tema används för att utforma galleriet [advanced_settings] images_per_page = [thumbnail_count]; Bilder som visas per sida kräver; enable_pagination sätts till "true" images_sort_by = natcasesort; Metod som används för att sortera bildmatris Tillgängliga sorteringsalternativ inkluderar:; asort, arsort, ksort, krsort,; natcasesort, natsort, shuffle reverse_sort = false; Ange till "true" för att vända sorteringsorder enable_debugging = false; Output debug messages 

Det är en fil som liknar UberGallery-konfigurationsfilen galleryConfig.ini, men med platshållare. Det kommer att användas för att skapa en verklig konfigurationsfil i flygningen när admin sparar konfigurationsformuläret från backend.

Slutligen, enligt UberGallery krav måste du kopiera system / bibliotek / uberGallery / resurser / sample.galleryConfig.ini till system / bibliotek / uberGallery / resurser / galleryConfig.ini. Se också till att system / bibliotek / uberGallery / resurser / galleryConfig.ini och System / Library / uberGallery / resurser / cache kan skrivas av webbservern.

Fortsätt sedan och skapa en fil admin / styrenheten / modul / uber_gallery.php med följande innehåll.

last> språk ( 'modul / uber_gallery'); $ This-> last> modell ( 'förlängning / modul'); $ This-> dokument-> setTitle ($ this-> språk-> get ( 'HEADING_TITLE')); om (($ this-> request-> server ['REQUEST_METHOD'] == 'POST') && $ this-> validera ()) om (! isset ($ this-> request-> få ['module_id'] )) $ this-> model_extension_module-> addModule ('uber_gallery', $ this-> request-> post);  else $ this-> model_extension_module-> editModule ($ this-> request-> få ['module_id'], $ this-> request-> post);  // uppdatera uber config filen $ config_file = implode ("\ n", fil (DIR_SYSTEM.'library / uberGallery / resources / oc.galleryConfig.ini ')); $ tokens = array ("[cache_expiration]", "[thumbnail_width]", "[thumbnail_height]", "[thumbnail_quality]", "[thumbnail_count]"); $ ersättning = array ($ this-> request-> post ['thumb_caching'], $ this-> request-> post ['thumb_width'], $ this-> request-> posta ['thumb_height'], $ this- > request-> post ['thumb_quality'], $ this-> request-> posta ['thumb_count']); $ save_config_file = str_replace ($ tokens, $ replacements, $ config_file); $ fp = fopen (DIR_SYSTEM.'library / uberGallery / resurser / galleryConfig.ini ',' w '); @fwrite ($ fp, $ save_config_file, strlen ($ save_config_file)); $ this-> session-> data ['success'] = $ this-> language-> get ('text_success'); $ this-> response-> omdirigera ($ this-> url-> länk ('extension / module', 'token ='. $ this-> session-> data ['token'], 'SSL'));  $ data ['heading_title'] = $ this-> language-> get ('heading_title'); $ data ['text_edit'] = $ this-> language-> get ('text_edit'); $ data ['text_enabled'] = $ this-> language-> get ('text_enabled'); $ data ['text_disabled'] = $ this-> language-> get ('text_disabled'); $ data ['entry_name'] = $ this-> language-> get ('entry_name'); $ data ['entry_status'] = $ this-> language-> get ('entry_status'); $ data ['entry_thumb_caching'] = $ this-> language-> get ('entry_thumb_caching'); $ data ['entry_thumb_quality'] = $ this-> language-> get ('entry_thumb_quality'); $ data ['entry_thumb_width'] = $ this-> language-> get ('entry_thumb_width'); $ data ['entry_thumb_height'] = $ this-> language-> get ('entry_thumb_height'); $ data ['entry_thumb_count'] = $ this-> language-> get ('entry_thumb_count'); $ data ['entry_enable_module_paging'] = $ this-> language-> get ('entry_enable_module_paging'); $ data ['button_save'] = $ this-> language-> get ('button_save'); $ data ['button_cancel'] = $ this-> language-> get ('button_cancel'); om (isset ($ this-> error ['warning'])) $ data ['error_warning'] = $ this-> error ['warning'];  andra $ data ['error_warning'] = "; om (isset ($ this-> error ['error_name'])) $ data ['error_name'] = $ this-> error ['error_name'];  annat $ data ['error_name'] = ";  om (isset ($ this-> error ['error_thumb_width'])) $ data ['error_thumb_width'] = $ this-> error ['error_thumb_width'];  annat $ data ['error_thumb_width'] = "; om (isset ($ this-> error ['error_thumb_height'])) $ data ['error_thumb_height'] = $ this-> fel ['error_thumb_height'];  annat $ data ['error_thumb_height'] = ";  om (isset ($ this-> error ['error_thumb_quality'])) $ data ['error_thumb_quality'] = $ this-> error ['error_thumb_quality'];  annan $ data ['error_thumb_quality'] = "; om (isset ($ this-> error ['error_thumb_count'])) $ data ['error_thumb_count'] = $ this-> fel ['error_thumb_count'];  annat $ data ['error_thumb_count'] = ";  $ data ['breadcrumbs'] = array (); $ data ['breadcrumbs'] [] = array ('text' => $ this-> language-> få ('text_home'), 'href' => $ this-> url-> länk ('common / dashboard' , 'token ='. $ this-> session-> data ['token'], 'SSL')); $ data ['breadcrumbs'] [] = array ('text' => $ this-> language-> få ('text_module'), 'href' => $ this-> url-> länk , 'token ='. $ this-> session-> data ['token'], 'SSL')); $ data ['breadcrumbs'] [] = array ('text' => $ this-> language-> get ('heading_title' ), 'href' => $ this-> url-> länk ('module / uber_gallery', 'token ='. $ this-> session-> data ['token'], 'SSL'));  andra $ data ['breadcrumbs'] [] = array ('text' => $ this-> language-> få ('heading_title'), 'href' => $ this-> url-> länk / uber_gallery ',' token = '. $ this-> session-> data [' token '].' & module_id = '. $ this-> request-> få [' module_id '],' SSL '));  if (! isset ($ this-> request-> få ['module_id'])) $ data ['action'] = $ this-> url-> länk ('module / uber_gallery', 'token ='. $ this-> session-> data ['token'], 'SSL');  annan $ data ['action'] = $ this-> url-> länk ('module / uber_gallery', 'token ='. $ this-> session-> data ['token']. '& module_id ='. $ this-> request-> få ['module_id'], 'SSL');  $ data ['cancel'] = $ this-> url-> länk ('extension / module', 'token ='. $ this-> session-> data ['token'], 'SSL'); $ this-> request_ > getModule ($ this-> begäran-> get [ 'module_id']);  om (isset ($ this-> request-> posta ['namn'])) $ data ['name'] = $ this-> request-> posta ['namn'];  elseif (! tomt ($ module_info)) $ data ['name'] = $ module_info ['name'];  andra $ data ['name'] = "; om (isset ($ this-> request-> posta ['thumb_width'])) $ data ['thumb_width'] = $ this-> request-> post ['thumb_width']; elseif (! tomt ($ module_info)) $ data ['thumb_width'] = $ module_info ['thumb_width']; annat $ data ['thumb_width'] = ";  if (isset ($ this-> request-> posta ['thumb_height'])) $ data ['thumb_height'] = $ this-> request-> posta ['thumb_height'];  elseif (! tomt ($ module_info)) $ data ['thumb_height'] = $ module_info ['thumb_height'];  annan $ data ['thumb_height'] = "; om (isset ($ this-> request-> posta ['thumb_quality'])) $ data ['thumb_quality'] = $ this-> request-> post ['thumb_quality']; elseif (! tomt ($ module_info)) $ data ['thumb_quality'] = $ module_info ['thumb_quality']; annat $ data ['thumb_quality'] = ";  if (isset ($ this-> request-> posta ['thumb_count'])) $ data ['thumb_count'] = $ this-> request-> posta ['thumb_count'];  elseif (! tomt ($ module_info)) $ data ['thumb_count'] = $ module_info ['thumb_count'];  annan $ data ['thumb_count'] = "; om (isset ($ this-> request-> posta ['thumb_caching'])) $ data ['thumb_caching'] = $ this-> request-> post ['thumb_caching']; elseif (! tomt ($ module_info)) $ data ['thumb_caching'] = $ module_info ['thumb_caching']; annat $ data ['thumb_caching'] = ";  if (isset ($ this-> request-> posta ['enable_module_paging'])) $ data ['enable_module_paging'] = $ this-> request-> posta ['enable_module_paging'];  elseif (! tomt ($ module_info)) $ data ['enable_module_paging'] = $ module_info ['enable_module_paging'];  annan $ data ['enable_module_paging'] = "; om (isset ($ this-> request-> posta ['status'])) $ data ['status'] = $ this-> request-> post ['status']; elseif (! tomt ($ module_info)) $ data ['status'] = $ module_info ['status']; annat $ data ['status'] = ";  $ data ['header'] = $ this-> load-> controller ('common / header'); $ data ['column_left'] = $ this-> load-> controller ('common / column_left'); $ data ['footer'] = $ this-> load-> controller ('common / footer'); $ this-> response-> setOutput ($ this-> load-> view ('modul / uber_gallery.tpl', $ data));  skyddad funktion validera () if (! $ this-> user-> hasPermission ('modify', 'module / uber_gallery')) $ this-> error ['warning'] = $ this-> language-> get ( 'error_permission');  om (! $ this-> request-> posta ['namn']) $ this-> error ['error_name'] = $ this-> language-> get ('error_name');  om ! $ this-> request-> posta ['thumb_width']) $ this-> error ['error_thumb_width'] = $ this-> language-> get ('error_thumb_width');  om ! $ this-> request-> posta ['thumb_height']) $ this-> error ['error_thumb_height'] = $ this-> language-> få ('error_thumb_height');  om (! $ this-> request-> posta ['thumb_quality']) $ this-> error ['error_thumb_quality'] = $ this-> language-> få ('error_thumb_quality');  om (! $ this-> request-> posta ['thumb_count']) $ this-> error ['error_thumb_count'] = $ this-> language-> få ('error_thumb_count');  returnera! $ this-> error; 

Som vanligt ser du två standardmetoder i vilken back-end-kontrollerfil som helst index metod som används för att tillhandahålla standardlogik som handlar om att lagra konfigurationsformvärden och bekräfta metod som används för att validera konfigurationsformuläret.

Som jag redan nämnde i början av artikeln att du borde vara bekant med grundläggande modulutveckling i OpenCart, diskuterar vi koden som är specifik för UberGallery-delen.

Förutom att du gör vanliga indexmetoder, laddar lämpliga språk och modeller och ställer in variabler för visningsmallfilen finns det en intressant kod i vår indexmetod. Låt oss titta på det noga.

// uppdatera uber config filen $ config_file = implode ("\ n", fil (DIR_SYSTEM.'library / uberGallery / resources / oc.galleryConfig.ini ')); $ tokens = array ("[cache_expiration]", "[thumbnail_width]", "[thumbnail_height]", "[thumbnail_quality]", "[thumbnail_count]"); $ ersättning = array ($ this-> request-> post ['thumb_caching'], $ this-> request-> post ['thumb_width'], $ this-> request-> posta ['thumb_height'], $ this- > request-> post ['thumb_quality'], $ this-> request-> posta ['thumb_count']); $ save_config_file = str_replace ($ tokens, $ replacements, $ config_file); $ fp = fopen (DIR_SYSTEM.'library / uberGallery / resurser / galleryConfig.ini ',' w '); @fwrite ($ fp, $ save_config_file, strlen ($ save_config_file));

Vad vi försöker nå här är att när admin sparar UberGallery-konfigurationsformen i back-end, galleryConfig.ini bör skapas i flygningen. Minnas det oc.galleryConfig.ini vi skapade i början av det här avsnittet, och du borde nu förstå tricket bakom det.

Vi hämtar innehållet i system / bibliotek / uberGallery / resurser / oc.galleryConfig.ini, byta platshållare med faktiska värden och slutligen spara det som en galleryConfig.ini som skriver över den befintliga standardfilen.

Flytta framåt, skapa en fil admin / språk / engelska / modul / uber_gallery.php med följande innehåll.

Inget extraordinärt - vi förklarar bara språkvariabler i den här filen.

Slutligen skapar vi en mallfil för visning som innehåller XHTML för vår anpassade konfigurationsform. Gå vidare och skapa en fil admin / view / mall / modul / uber_gallery.tpl med följande innehåll.

 
"data-switch =" tooltip "title ="">

  • ">

(mellan 1-100)

Så, det är så långt som bakåt-filen fil setup.

Testa konfigurationsformuläret

Gå över till baksidan och navigera till Extensions> Moduler. Installera vår nyskapade uberGallery modulen och redigera den för att öppna konfigurationsformuläret.

Fyll i värdena efter behov och spara formuläret! Det kommer givetvis att spara modulinställningarna i databasen, men dessutom kommer det att generera en ny galleryConfig.ini också! Gå vidare och öppna system / bibliotek / uberGallery / resurser / galleryConfig.ini, och det bör återspegla parametervärdena med fältet för konfigurationsform.

Så, vi har just byggt en mekanism att generera galleryConfig.ini på flugan med hjälp av en konfigurationsblankett! Den kommer att användas i fronten när vi aktiverar modulen för att visa galleriet.

Så det är det för dagens artikel. Jag kommer snart tillbaka med nästa del av denna serie.

Slutsats

I den här första delen har vi gått igenom back-end-filinställningen för UberGallery-modulen. I nästa del utforskar vi den främre delen av den. För frågor, använd kommentarerna nedan!