Maak een aangepaste pagina in OpenCart

Houd rekening met het feit dat we specifiek van plan zijn om direct in het artikel te springen. 

Daartoe gaan we ervan uit dat u een werkkopie van OpenCart hebt geïnstalleerd en klaar bent om aan het werk te gaan.

De basis workflow

OpenCart is gebouwd met behulp van het populaire programmeer-MVC-patroon. Er is ook nog een element toegevoegd aan dit patroon met de naam "L" - een taalonderdeel - dus het wordt MVC-L-patroon genoemd in OpenCart. Ik zal niet ingaan op de details van het MVC-patroon, want het is een zeer populair en bekend ontwerppatroon en we hebben het uitgebreid besproken in andere tutorials. 

Dat gezegd hebbende, we moeten nog steeds naar de workflow kijken met behulp van dit patroon.

Ten eerste fungeert de controller als een startpunt voor elke pagina waarin u de meeste toepassingslogica definieert.Het model behandelt de back-enddatabase en de weergave is verantwoordelijk voor het voorbereiden van de inhoud die aan de eindgebruiker moet worden weergegeven. In de context van OpenCart moet u ten minste een controller en een weergave implementeren om een ​​nieuwe aangepaste pagina te maken.

De controller instellen

Laten we eerst proberen de rol van de controller in OpenCart te begrijpen. De controller is het eerste element dat wordt uitgevoerd wanneer u een pagina opvraagt. In de eerste plaats is het verantwoordelijk voor het instellen van de variabelen die later in de weergave voor de weergave worden gebruikt. Hoewel er in de generieke controller veel gebeurt:

  • U kunt taalbestanden laden zodat u taalvariabelen kunt gebruiken voor het weergeven van statische tekst.
  • U kunt modelbestanden laden, zodat u de in die modellen gedefinieerde methoden kunt gebruiken om gegevens op te halen uit de back-enddatabase.
  • U kunt het sjabloonbestand definiëren dat door de weergave wordt gebruikt.
  • U kunt de aangepaste variabelen instellen door ze inhoud toe te wijzen die in het sjabloonbestand zal worden gebruikt.
  • U kunt de kinderensjablonen die u wilt weergeven als onderdeel van de hoofdsjabloon declareren. Het eenvoudigste voorbeeld hiervan zijn de kop- en voetregelsjablonen die u in uw hoofdsjabloon wilt weergeven.
  • Ten slotte kunt u ook waarden instellen voor de dingen zoals documenttitel, metabeschrijving enz.

Genoeg theorie, toch? Laten we eens kijken hoe onze aangepaste controller eruit ziet. Ga je gang en maak een nieuwe map aan custompage onder catalogus / controller. Maak een nieuw bestand mycustompage.php onder catalogus / controller / custompage. Plak de volgende code in het zojuist gemaakte controllerbestand "mycustompage.php".

document-> setTitle ("Mijn aangepaste pagina"); // define template file if (file_exists (DIR_TEMPLATE. $ this-> config-> get ('config_template'). '/template/custompage/mycustompage.tpl')) $ this-> template = $ this-> config- > get ('config_template'). '/Template/custompage/mycustompage.tpl';  else $ this-> template = 'default / template / custompage / mycustompage.tpl';  // kinderen sjablonen definiëren $ this-> children = array ('common / column_left', 'common / column_right', 'common / content_top', 'common / content_bottom', 'common / footer', 'common / header') ; // stel gegevens in op de variabele $ this-> data ['my_custom_text'] = "Dit is mijn eigen pagina."; // roep "View" om de uitvoer $ this-> response-> setOutput ($ this-> render ()) te renderen; ?>

Laten we de naamgevingsconventie van de controllerklasse begrijpen. De klassenaam van de controller wordt geconstrueerd door de directorystructuur en de conventie van de kameelgeval te volgen. Merk op dat de klassenaam begint met het sleutelwoord "Controller" gevolgd door de directorynaam ("Custompage") waarin het klassenbestand zich bevindt. En ten slotte wordt de naam van het klassenbestand ("Mycustompage") aan het einde toegevoegd. Laten we nu elk gedeelte in detail ontleden.

Eerst hebben we de waarde van de html-title-tag ingesteld voor onze aangepaste pagina.

$ this-> document-> setTitle ("My Custom Page");

In de volgende sectie hebben we de naam van het sjabloonbestand gedefinieerd, die zal worden gebruikt door het element "Beeld". Een belangrijk ding om op te merken is dat we eerst hebben gecontroleerd of het sjabloonbestand beschikbaar is in de aangepaste themaset vanaf de back-end, als het beschikbaar is in het aangepaste thema dat we gebruiken, anders gebruiken we het sjabloonbestand in het thema "standaard". 

Dit is het concept van sjabloon overschrijven.

if (file_exists (DIR_TEMPLATE. $ this-> config-> get ('config_template'). '/template/custompage/mycustompage.tpl')) $ this-> template = $ this-> config-> get ('config_template '). '/Template/custompage/mycustompage.tpl';  else $ this-> template = 'default / template / custompage / mycustompage.tpl'; 

We hebben ook de onderliggende sjablonen gedefinieerd met behulp van de array. Als voorbeeld, common / header mappen naar het sjabloonbestand op catalogus / view / theme / default / template / common / header.tpl en voert hetzelfde uit. Het resultaat hiervan wordt toegewezen aan $ header-variabele die u in uw sjabloonbestand kunt gebruiken om de sitekop weer te geven.

$ this-> children = array ('common / column_left', 'common / column_right', 'common / content_top', 'common / content_bottom', 'common / footer', 'common / header');

Bovendien hebben we aangetoond hoe u de aangepaste variabelen kunt instellen die beschikbaar zijn in het sjabloonbestand. Hoewel we hier een eenvoudige statische tekst hebben gebruikt, kunt u een meer verstandige inhoud toewijzen, bijvoorbeeld een productenarray die is opgehaald uit de
databank.

$ this-> data ['my_custom_text'] = "Dit is mijn eigen pagina.";

Ten slotte is het belangrijkste om weergave aan te roepen zodat het daadwerkelijke weergaveproces kan beginnen.

$ This-> response-> Inschakeling ($ this-> render ());

Dus dat is de glimp van de workflow van de controller.

In de front-end krijgt u toegang tot deze controller met behulp van de queryreeksvariabele  route = custompage / mycustompage. Het is belangrijk om hier op te merken dat als u de controlemechanismemethode met een andere naam behalve definieert inhoudsopgave u moet dat ook in de URL specificeren. 

Bijvoorbeeld als u de methode named hebt gemaakt gewoonte, uw front-end URL-indeling moet er uit zien route = custompage / mycustompage / custom.

Laten we begrijpen hoe OpenCart kaarten maaktelke URL naar het specifieke controllerdossier. Het formaat van de routevariabele is Directory / bestandsnaam / methodname. Directory kaarten naar de map onder catalogus / controller. bestandsnaam wijst naar de naam van het controllerbestand onder catalogus / controller / directory. En tot slot zal het zoeken naar de genoemde controller-methode MethodName als het in de route is opgegeven, anders wordt dit de standaardinstelling inhoudsopgave methode.

Bereid de weergave voor

In deze sectie maken we het beeldsjabloonbestand dat we eerder in de controllerindexmethode hebben gedefinieerd. Ga je gang en maak een nieuwe map aan custompage onder catalogus / view / theme / default / template. Maak een nieuw bestand mycustompage.tpl onder catalogus / view / theme / default / template / custompage. Plak de volgende inhoud in het nieuw gemaakte sjabloonbestand mycustompage.tpl.

 

Dit is dus ons belangrijkste lay-outsjabloonbestand dat verantwoordelijk is voor het weergeven van de inhoud van onze aangepaste pagina. In dit sjabloonbestand hebben we zojuist de variabelen gebruikt die we in de controller hebben ingesteld inhoudsopgave methode. 

De enige aangepaste variabele in dit sjabloonbestand is $ my_custom_text, de rest van de variabelen bevatten de inhoud met betrekking tot de onderliggende sjablonen zoals koptekst, voettekst, etc. De variabelen $ column_left, $ column_right, $ content_top en $ content_bottom worden gebruikt om de modules weer te geven die zijn toegewezen aan onze aangepaste pagina vanaf de back-end.

Als u modules wilt toewijzen aan onze aangepaste pagina, moet u eerst een nieuw lay-outitem maken vanaf de back-end. Nadat u een nieuwe lay-out hebt toegevoegd, wilt u een route toevoegen zoals custompage / mycustompage invoer voor die lay-out. Nu kunt u elke module ook toewijzen aan onze aangepaste pagina.

U hebt zojuist een volledige aangepaste pagina in de OpenCart gebouwd! U kunt hetzelfde controleren op URL: http://www.yoursiteurl.com/index.php?route=custompage/mycustompage.

Conclusie

In deze zelfstudie hebben we geleerd hoe we onze eigen aangepaste pagina in OpenCart kunnen maken. Als u bekend bent met het MVC-patroon, moet de werkstroom voor het maken van een nieuwe aangepaste pagina bekend zijn.

Ga je gang en verken enkele kernbestanden om vertrouwd te raken met de code. Ik zou graag willen dat u ons voorbeeld uitbreidt door model- en taalbestanden in de controller te laden en te zien hoe de dingen werken! In afwachting van de feedback, vragen en opmerkingen!