I have an observer and i need to generate a css file dynamically - using my admin theme setting configuration - calling my observer function.
-
In one of my custom module from backend, i can change the colors and those color values are used in phtml file and finally that css with updated value is called in footer or header where you want, do you want the same or something more dynamic ?– inrsaurabhCommented Mar 25, 2018 at 8:12
-
yes the same thing for a custom theme. i have just create admin config and controller on admin setting save– AltravistaCommented Mar 25, 2018 at 8:17
-
so where you stuck ?– inrsaurabhCommented Mar 25, 2018 at 8:18
-
i need to create the function to generate css in my custom theme from phtml. i don't kwon how to get code from phtml in controller function and generate variable path to my custom theme css folder where i have to put css generated– AltravistaCommented Mar 25, 2018 at 8:19
-
if i understood, you just want to update the css values right which are changed form module setting page ?– inrsaurabhCommented Mar 25, 2018 at 8:23
2 Answers
As per your initial question:
Step 1 .
In /var/www/html/magento2/app/code/Companyname/ModuleName/Block/dynamiccss.php
In this file we get the css values
like below :
public function color_right_headingh() {
return $this->_helper->color_right_headingh();
}
Step 2:
In /var/www/html/magento2/app/code/Companyname/ModuleName/Helper/Data.php
We must create the helper methods attached to this view
public function color_right_headingh() {
return $this->_scopeConfig->getValue(self::COLORRIGHTHEADING);
}
Step 3:
In /var/www/html/magento2/app/code/HestabitCompanyname/Modulename/view/frontend/templates/dynamiccss.phtml
.someClassTag {
color :<?php echo $color_right_headingh; ?>;
}
Step 4: : YOu can choose the pages on which you want to change the values or use default.xml
for gloabl scope of your phtml file.
In /var/www/html/magento2/app/code/Companyname/ModuleName/view/frontend/layout/cms_index_index.xml
<body>
<!-- //sidebar.additional on home page
name ="page.bottom" at bottom of home page
name= "footer" before="-" :: above footer
name="footer" after="-" :: below footer
-->
<referenceContainer name="header.panel">
<block class="Companyname\ModuleName\Block\Dynamiccss" name="dynamiccss" template="Companyname_ModuleName::dynamiccss.phtml"/>
</referenceContainer>
-----------------
this is my configuration Helper
namespace Altravista\ThemeSetting\Helper;
use Magento\Framework\App\Helper\AbstractHelper;
use Magento\Store\Model\ScopeInterface;
class ConfigSetting extends AbstractHelper
{
const XML_PATH_THEMESETTING = 'themesetting/';
public function getConfigValue($field, $storeId = null)
{
return $this->scopeConfig->getValue(
$field, ScopeInterface::SCOPE_STORE, $storeId
);
}
public function getGeneralConfig($code, $storeId = null)
{
return $this->getConfigValue(self::XML_PATH_THEMESETTING .'general/'. $code, $storeId);
}
}
This is my GenerateCss Helper
namespace Altravista\ThemeSetting\Helper;
use Magento\Framework\App\Helper\AbstractHelper;
use Magento\Store\Model\ScopeInterface;
use \Altravista\ThemeSetting\Helper\ConfigSetting;
class GenerateStyle extends AbstractHelper
{
protected $helperConfigSetting;
public function __construct(
ConfigSetting $helperConfigSetting
) {
$this->helperConfigSetting = $helperConfigSetting;
}
public function ciao(){
return 'Hallo :)';
}
public function getConf($data){
return $this->helperConfigSetting->getGeneralConfig($data);
}
public function override_css() {
$line = "\n";
$style = 'a { color:'.$this->getConf('link_color').'}'.$line;
$style .= 'a:hover { color:'.$this->getConf('link_hover_color').'}'.$line;
return $style;
}
public function generateStoreCss() {
$content = $this->override_css();
$fp = fopen($_SERVER['DOCUMENT_ROOT'] . "/app/design/frontend/Altravista/bookshop/web/css/design.css","wb");
fwrite($fp,$content);
fclose($fp);
}
}
this is my observer
namespace Altravista\ThemeSetting\Observer;
use Magento\Framework\Event\ObserverInterface;
use Magento\Framework\Event\Observer as EventObserver;
use Psr\Log\LoggerInterface as Logger;
use Altravista\ThemeSetting\Helper\GenerateStyle;
class ConfigObserver implements ObserverInterface
{
/**
* @var Logger
*/
protected $logger;
/**
* @param Logger $logger
*/
public function __construct(
Logger $logger,
GenerateStyle $helperGenerateStyle
) {
$this->logger = $logger;
$this->helperGenerateStyle = $helperGenerateStyle;
}
public function execute(EventObserver $observer)
{
$message = $this->helperGenerateStyle->ciao();
$this->logger->info($message);
$this->logger->debug($message);
$this->helperGenerateStyle->generateStoreCss();
//$this->logger->info($observer->getStore());
}
}