Add pages to Magento from an extension
A few days ago we learned to create a module for Magento , today we learn to make new pages for Magento. I would say in an intuitive and simple, but for what I am going to cheat …
Come goes, seriously. Create new pages for Magento is simple, provided you have a mind well structured, able to link different parts of different files with each other, creating a complex web of relationships, especially if, as in the case we will see, the thing is complicated.If you do not, do not worry, I’ll try to make it as simple as possible.
Recently we had to create a new page in Magento system, accessible through the client area «My Account». So we will use as an example to develop this theme.
Let’s steps. I recommend you read first the previous post on how to create a module for Magento, and I’ll work on that example. We will create an accessible page from «My account», to show us the log file to generate every time a file is modified. Do not you see it useful? Well, me neither, but the important thing is not the utility that has a modulus of example, if you learn how to make your own modules.
Modifying the config.xml to accept our route
Our site will be accessible from one direction with this pattern <urlbase> / <nombredelmodulo> / <page> where URLBase is the url of our shop, and nombredelmodulo is the name of our module.Http://urldelatienda.com/mimodulo/index something like, for example.
This will not happen by magic. It will happen because we will specify in a redirect to our config.xml file (in the etc folder of your module).
The last time we add the global tag here, encompassing all of our code. Well, let’s just where just after </ global> and before </ config> and write this:
<frontend> <routers> <controldeproductos> <use>standard</use> <args> <module>Codigonexo_ControlDeProductos</module> <frontName>controldeproductos</frontName> </args> </controldeproductos> </routers> <layout> <updates> <codigonexo_controldeproductos> <file>codigonexo_controldeproductos.xml</file> </codigonexo_controldeproductos> </updates> </layout> </frontend>
Okay, we split.
We added <frontend> label, denoting that we will act on the [def] front end [/ def] application. Within two labels: routers and layout.
<routers> is the label that is going to serve as forwarder. We establish in <module> the full module name, with the company folder and module folder, separated by an underscore. In frontName specify the name you want to have on the road (which is the same label that encompasses all within <routers>).
<layout> Layout file defines to be loaded when accessing this page. This file must always be in the Layout folder of the theme you’re using. We use design / frontend / base / default. Here in the Layout folder, create your layout file, codigonexo_controldeproductos.xml.
Before turning to the Layout, we need one more thing in our config.xml. Among the events, you must define a new observer:
<controller_action_layout_load_before> <observers> <codigonexo_controldeproductos> <type>singleton</type> <class>codigonexo_controldeproductos/observer</class> <method>showLogLink</method> </codigonexo_controldeproductos> </observers> </controller_action_layout_load_before>
This defines a new action to be included clearly in our archive Codigonexo / ControlDeProductos / Model / Observer.php:
public function showLogLink(Varien_Event_Observer $observer){
if(Mage::getSingleton('customer/session')->isLoggedIn() ){ // Solo si el usuario esta logueado
// Código que gestiona si un usuario puede acceder o no al enlace.
if(/*CONDICION*/){
$update->addHandle('customer_controldeproductos_link');
}
}
}So now, depending on your code and conditions, the link will be shown to all or only to a number of users. If you do not want conditions, simply let the line $ update-> addHandle (‘<customer_controldeproductos_link>’) What is this? We will see soon.
The Layout
This file is one that modifies the data on the screen as you say. For now, we will create and copy the code, then explain.
<?xml version="1.0" encoding="UTF-8"?>
<layout version="0.1.0">
<!-- Lo primero es añadir un enlace en el menu de navegación -->
<!-- Este es el nombre que veíamos en Observer.php -->
<customer_controldeproductos_link>
<reference name="customer_account_navigation">
<action method="addLink" translate="label">
<!-- Los atributos del enlace. Es importante saber que 'path' define la segunda parte de la url -->
<name>controldeproductos</name>
<path>controldeproductos/log</path>
<label>Control de Productos</label>
<update handle='customer_account'/>
</action>
</reference>
</customer_controldeproductos_link>
<!-- Ahora ya nos centramos en nuestra página nueva -->
<controldeproductos_log_index translate="label">
<label>Control de Productos</label>
<update handle="customer_account"/>
<reference name="my.account.wrapper">
<!-- Importante que recordemos el name y el template del bloque -->
<block type="page/html" name="controldeproductos_log" template="codigonexo_controldeproductos/log.phtml" />
</reference>
</controldeproductos_list_index>
</layout>As you can see in the comments, we first define the new link. Attribute defines the / our pattern for url: / / .
Importantly is the label that makes all this it acts on the user page.
For our website, we created a new label (controldeproductos_log_index, for example). It is important that we have a reference, which in this case is «my.account.wrapper», or your code will not appear anywhere. In the , the name and the template are important because they define the name of the block that are loading, and plantlla to use. The template must be created in / design / frontend / base / default / template.
The template
The template file you create with. Phtml inside the folder we have already indicated. Its content is basically html (php generated or not) that is displayed when you enter the page.
We will show the file contents var / log / product-updates.log, that’s what it is this example.
<?php
$logfile = Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB)."var/log/product-updates.log";
$loghtml = "";
if($logfile){
$loghtml = file_get_contents($logfile);
}
?>
<div class="block block-codigonexo_controldeproductos">
<div class="block-title">
<strong><span>Log de Control de Productos</span></strong>
</div>
<div id='log_content'>
<?=$loghtml;?>
</div>
</div>
All this is very nice … but as you have seen, still does not work.
Not just a template and layout. We need one more file that connects all this. We need the controller.
The Controller
The last thing left to do is create a file called «controller» or Driver, representing our Layout when accessing the page.
The controller will be in our module, in the «controllers» (incredible as it seems, this time, in lower case), and should be called as the action you want to execute. In this case: LogController.php.
Inside we will define a new class, whose name must be Empresa_Modulo_AcciónController. In our case, Codigonexo_ControlDeProductos_LogController. Obviously, we can define the functions we need, but there are at least two that can not miss: the function that performs the action, call the action name followed by action, and function indexAction.
<?php
class Codigonexo_ControlDeProductos_LogController extends Mage_Core_Controller_Front_Action
{
public function logAction(){
$this->loadLayout();
$this->getLayout()->getBlock('controldeproductos_log')->setTitle('Control de Productos');
$this->renderLayout();
}
public function indexAction(){
$this->logAction();
}
}
?>
Remember the <block> we defined in the layout? As the name attribute of the block is the parameter that we pass through getBlock function.
The second, indexAction, is what ensures that the address is simply «controldeproductos / log».
If now you have been offered a client user to the «My Account», you should see a more link at the bottom of the left navigation menu, which will send you to a page showing the product-updates.log log.
How do you have left the body? I recommend that you turn to read the entire tutorial again for you to understand better the connections between files. And if you do not clear, another, again and again.
Let’s review some of what we’ve done.
- We modified the config.xml so that it accepts the correct redirection to the new page.
- We’ve added a new observer to event controller_action_layout_load_before ‘running action’ showLogLink ‘, connecting directly with the layout in’ customer_controldeproductos_link ‘.
- We have defined in the Layout link in the navigation menu of the client, and the block will execute our staff.
- We created the template.
- We have created a driver running to access our correct url and loads the corresponding layout.
What you see better now? I hope that is more or less clear. If you do not understand something or something does not work, do not hesitate to comment!
A greeting!
You might want to read Part One: Create an extension for Magento .
«The main challenge for computer scientists is not
confused with the complexity of their own making » – EW Dijkstra
Loading...Suscríbete. Déjanos tu email y recibe contenido genial cada mes
