As we finished with the basic module structure and admin part we move to Magento 2 create basic module frontend .Now this tutorial will be cover the create frontend router, create layout file, create frontend controller, create frontend block, add custom pagination. Now we start with frontend.
Create frontend router
Create routes.xml in following directory
QaisarSatti\HelloWorld\etc\frontend\
<?xml version="1.0"?>
<!--
/**
* Hello World
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email [email protected]
*
*/
-->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
<router id="standard">
<route id="helloworld" frontName="helloworld">
<module name="QaisarSatti_HelloWorld" />
</route>
</router>
</config>
Create frontend controller
Create Index.php in following directory
QaisarSatti\HelloWorld\Controller\Index\
<?php
/**
* Hello World
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email [email protected]
*
*/
namespace QaisarSatti\HelloWorld\Controller\Index
;
class Index
extends \Magento\Framework\App\Action\Action
{
public function execute
()
{
$this->_view
->loadLayout();
$this->_view
->renderLayout();
}
}
Create layout file
Create helloworld_index_index.xml in following directory
QaisarSatti\HelloWorld\etc\frontend\
<?xml version="1.0"?>
<!--
/**
* Hello World
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email [email protected]
*
*/
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="QaisarSatti\HelloWorld\Block\HelloWorld" name="HellosWorld" template="QaisarSatti_HelloWorld::HelloWorld.phtml"></block>
</referenceContainer>
</body>
</page>
Create frontend block
Create HelloWorld.php in following directory
QaisarSatti\HelloWorld\Block\
<?php
/**
* Hello World
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email [email protected]
*
*/
namespace QaisarSatti\HelloWorld\Block
;
class HelloWorld
extends \Magento\Framework\View\Element\Template
{
protected $_coreRegistry = null;
protected $_collectionFactory;
protected $_productsFactory;
protected $_helloworldFactory;
public function __construct
(
\Magento\Backend\Block\Template\Context
$context,
\Magento\Framework\Registry
$registry,
\QaisarSatti\HelloWorld\Model\ResourceModel\HelloWorld\CollectionFactory
$helloworldFactory,
array $data = []
) {
$this->_coreRegistry
= $registry;
$this->_helloworldFactory
= $helloworldFactory;
parent
::__construct
($context, $data);
}
public function getHelloCollection
()
{
$page=($this->getRequest()->getParam('p'))?
$this->getRequest()->getParam('p') : 1;
//get values of current limit
$pageSize=($this->getRequest()->getParam('limit'))?
$this->getRequest()->getParam('limit') : 5;
$helloCollection = $this->_helloworldFactory
->create();
$helloCollection->setPageSize($pageSize);
$helloCollection->setCurPage($page);
return $helloCollection;
}
public function _prepareLayout
()
{
parent
::_prepareLayout
();
$this->pageConfig->getTitle()->set(__
('Sample Post'));
if ($this->getHelloCollection()) {
$pager = $this->getLayout()->createBlock('Magento\Theme\Block\Html\Pager','qaisarsatti.blog.pager')->setAvailableLimit(array(5=>5,10=>10,15=>15,20=>20));
$pager->setShowPerPage(true);
$pager->setCollection($this->getHelloCollection());
$this->setChild('pager', $pager);
$this->getHelloCollection()->load();
}
return $this;
}
public function getPagerHtml
(){
return $this->getChildHtml('pager');
}
}
Create frontend phtml
Create HelloWorld.phtml in following directory
QaisarSatti\HelloWorld\view\frontend\templates\
<?php
/**
* Hello World
*
* @category QaisarSatti
* @package QaisarSatti_HelloWorld
* @author Muhammad Qaisar Satti
* @Email [email protected]
*
*/
$blogCollection = $block->getHelloCollection();
foreach ($blogCollection as $blog) {
echo $blog->getTitle().'<br />';
echo ' '.$blog->getContent().'<br />';
}
if ($block->getPagerHtml()): ?>
<div
class="order-products-toolbar toolbar bottom">
<?php echo $block->getPagerHtml(); ?>
</div
>
<?php endif ?>
Author: Qaisar Satti
Last Modified: February 9, 2018