am trying to modify the PS 1.7 admin theme css, mostly just to highlight a test environment vs production, but also for a few colour changes.
I modified ./adminFolder/themes/default/css/override.css
However this only works for "old" pages. More and more pages are using the "New-Theme" and not "Default" in the Back Office. The Default theme has a CSS override file, but the New Theme does not.
How do we create such an override in the new theme folder?
I'm afraid you need to add your CSS to the back office using actionAdminControllerSetMedia and Controller::addCSS method.
Example:
https://github.com/PrestaShop/blockwishlist/blob/dev/blockwishlist.php#L123
This way, a new CSS will be added after the new theme's CSS so you can override every rule.
The trick is to overrride the setMedia function like this :
override/classes/controller/AdminController.php
<?php
class AdminController extends AdminControllerCore
{
public function setMedia($isNewTheme = false)
{
parent::setMedia($isNewTheme);
$this->addCSS(__PS_BASE_URI__ . $this->admin_webpath . '/themes/default/css/overrides.css', 'all', 1);
}
}
Related
Is there config setting that I can use as links within sitefinity MVC view? So I have a href's in my view that i dont want to hardcode them in the view cshtml file.
<a href="ConfigSetting">
I think you want to make a custom Config Section
https://www.progress.com/documentation/sitefinity-cms/for-developers-create-a-new-configuration
Then I always do something like this in a static helper class so I can use it in Views and around the site
public static MyConfig MyConfig {
get
{
return Telerik.Sitefinity.Configuration.Config.Get<MyConfig>();
}
}
So then it's
<a href="#Util.MyConfig.ConfigSetting">
Steve
https://www.sitefinitysteve.com
I have LiveZilla working on my site, but it's connected to the wrong hook. The chatbar only appears when i click on a menu (horizontal bar) it doesn't appear on homescreen / add to cart page or any other page except links on menu bar.
It only lets me hook it to the 'displayleftcollumn or displayrightcollumn' - when i run live edit i can see the module but its only on the menu pages.
I would like the chatbar to be on every page - I'm using the default bootstrap theme
How do i fix this?
site www.shop.tacitskills.com - click on classroom / online etc, the bar appears.
I have tried asking LiveZilla / Prestashop but no response.
You can edit the module php, and include this to add the option for the footer:
public function hookFooter($params)
{
return $this->hookLeftColumn($params);
}
Better yet, create an override file in folder overrides/modules/(modulename)/(modulename).php with
<?php
if (!defined('_PS_VERSION_'))
exit;
class (Modulename)Override extends (Modulename)
{
public function hookFooter($params)
{
return $this->hookLeftColumn($params);
}
}
In (modulename) use the livezilla module folder name.
This way, it will "survive" module updates.
Don't forget to delete the file cache/class_index.php after creating this file.
I'm trying to dynamically change some field color when it has changed due to some processing.
CUBA documentation explains how to do it statically through web theme extension (https://doc.cuba-platform.com/manual-6.2/web_theme_extension.html), but not dynamically. Although it is possible in Vaadin (https://vaadin.com/wiki/-/wiki/Main/Dynamically%20injecting%20CSS) on which platform web gui is built upon.
I suppose that if I use the Vaadin way of injecting CSS it will work (which I will try) but I will then have Vaadin specific code, which I'm trying to avoid.
Is there a CUBA way of doing so I'm missing ?
Edit:
I'm trying to have any field of a form to change background color when it has changed from its initial value. As per CUBA documentation (https://doc.cuba-platform.com/manual-6.2/web_theme_extension.html) I need to :
- create a SCSS mixin with background color
- inject the field in the editor class in order to have access to it
- react to a field change event and then define the style name of the field
I did create the SCSS mixin, but two issues I have :
1) I would like to retrieve the field instance dynamically instead of injecting it (keep code clean and light)
2) I would like to avoid defining the background color statically so that the color could be parameterized at runtime
For 1) I tried to injected the fieldGroup and used getFieldComponent(), then applied the style with setStyleName on it when it is changed. It worked but I would prefer to define this behavior for every field that is an input field.
For 2) apart from using Vaadin specific feature of injecting CSS (and tighing my code to Vaadin (and so leading me away of generic interface) I do not see how to do
Hope it's more clear
You cannot set truly dynamic color (any RGBA) from code to field but you can create many predefined colors for your field:
#import "../halo/halo";
#mixin halo-ext {
#include halo;
.v-textfield.color-red {
background: red;
}
.v-textfield.color-blue {
background: blue;
}
.v-textfield.color-green {
background: green;
}
}
I do not recommend using styles injected from code (as Vaadin Page does) since it is a mixing of logic and presentation. Instead you can create all predefined styles (30-50 styles should be enough) and assign it depending on some conditions using setStyleName method:
public class ExtAppMainWindow extends AppMainWindow {
#Inject
private TextField textField;
private int steps = 0;
public void changeColor() {
if (steps % 2 == 0) {
textField.setStyleName("color-red");
} else {
textField.setStyleName("color-blue");
}
steps++;
}
}
If you want to apply the logic of color change for all TextFields inside of FieldGroup you can iterate FieldGroup fields in the following way:
for (FieldGroup.FieldConfig fc : fieldGroup.getFields()) {
Component fieldComponent = fieldGroup.getFieldComponent(fc);
if (fieldComponent instanceof TextField) {
TextField textField = (TextField) fieldComponent;
textField.addValueChangeListener(e ->
textField.setStyleName("color-red")
);
}
}
How to setup a slider at the bottom-right corner in Prestashop like the picture? This slider consists of different picture. When I click an image, relative information will be shown on the right corner.
Simple you need to build a custom module. Please ref to prestashop.com document how you build custom module.
On that module hook the theme file yourmodulefile.tpl at FOOTER
Then make a wrap Div, set a class "footer_slide_wrap"
On your module CSS mark that class as bellow
.footer_slide_wrap{
display :fixed;
bottom : 0;
right :0;
width : 30px;
height:auto;
}
Now your DIV with class footer_slide_wrap will be place on that place.
now insert an UL and put your all button under li in this UL.
You can make the div .footer_slide_wrap mouse over slidable. For that you need to make a default div with class .opener and make the wrap hide.
need to create a javascript function to hide / show the DIV on mouse over.
you need to register a custom hook inside your slider module's php file, eg: "footerslider" then add the hook to your fooeter.tpl file which is located at "themes/yourthemes/footer.tpl" by placing this code {hook h="fooerslider"}
Basically, you should create small module that have hook.
Prestashop has many hooks related with your layout but if they are not suitable for you, you can create your own hook.
If you want to call your custom hook, simply put this code where you want to show.
{hook h="displayYourHookName"}
You need to install your custom hook in your install() function of your custom module.
// use this code in your install() function
$this->registerHook('displayYourHookName');
// your custom hook
public function hookDisplayYourHookName()
{
// code ...
// your html template that you want to show
return $this->display(__FILE__, 'yourTemplate.tpl');
}
if you are using default hook, prestashop will call automatically.
I hope this will help, cheers :)
Can someone tell me how can I have the breadcrumb nav within the header.tpl and not in the product.tpl of opencart?
I've just had to figure this out for a new site we're building and I've come up with the following; use at your own risk (I'll report back if I run into any major problems, but I can't foresee any... famous last words)
Basically the breadcrumbs are built in the controllers and we need the resulting $breadcrumbs array in the header controller. Modify system/engine/controller.php as follows:
[...snip...]
protected function render() {
foreach ($this->children as $child) {
$this->data[basename($child)] = $this->getChild($child,array('parent_data'=>&$this->data));
}
[...snip...]
This will send all the data in the parent controller, before render() was called, to every controller/method of the $children. Then we just need to pick this up in the header controller as follows:
<?php
class ControllerCommonHeader extends Controller {
protected function index($args=array()) {
// parent data
$this->data['parent_data'] = $args['parent_data'];
[...snip...]
And we can access everything in the template with $parent_data['whatever']. In this case, $parent_data['breadcrumbs'] will be the array of breadcrumbs that I can loop over with the code I've removed from each page.tpl and added to my header.tpl.
Due to the way 1.5.X is coded, you'll need to rewrite every controller and add a method back to the document class to allow passing from the product controller to the header controller. Is there any particular reason you want to do so?
if all else fails just hack the css, something like
.breadcrumb {
margin-left: -270px;
margin-top: -65px;
}
will move the breadcrumb up and to the left.