I'm running into a bit of a problem with my search plugin CSS. It doesn't apply some of the CSS rules I placed on /plugin/searchable/webroot/css/searchable_style. I think it is being overridden by the cakephp default CSS which I used with my application. Should I edit the generic css for my application or there's a way to bypass the generic CSS then apply what's on /plugin/searchable/webroot/css/searchable_style? I also tried
css('/searchable/css/searchable_style'); ?>
and put it on every view and it worked but not all.
Thank you,
Lyman
Place your css file *searchable_style* to webroot/css folder: then use it in app/views/layouts/default.ctp (if you have) OR include this line to your home or landing layout
echo $this->Html->css('/searchable/css/searchable_style');
This will definitely work. but if you rename the plugins folder to plugin as your question, then it will cause problem. Please check all folder naming and retry.
Related
Really simple answer possible but I've not had the chance to work with SASS yet and especially not in Wordpress so bear with me.
I'm working on a site that has been developed in Wordpress and need to make some edits to the CSS (just increase an element's min-height from 54px to 64px at the moment). It has been done using SASS and folders have been set up for the partials and imported via a main.scss.
Where I've got stuck is that I don't understand what I need to change or action to make the _general.scss file (imported via main.scss and in a folder) compile to update the style for this element. I've changed the value from 54px to 64px as it has saved in the _general.scss but this isn't reflected via the browser (if you view the actual scss page) hence it doesn't update the style.
I know I need to recompile it some how ...but how?
Sorry in advance for what is a newbie question from an experienced coder! (embarrassing!)
You do not necessarily need to edit the CSS of the template. You always have other options at your disposal.
you can either create a child theme and make changes in it
you can also create a custom style sheet and import the main stylesheet in your style sheet and put your code into your stylesheet
or you can simply download a plugin which will allow you to put your custom css in the backend of wordpress and the plugin will import the custom css in the end of the main css file.
Following is a link to a plugin that will give you a window to add your custom css into:
https://wordpress.org/plugins/simple-custom-css/
Please use this and do not get messed up with SASS.
I need to change/remove some CSS call links. I can see them in View Page Source. How do I actually get to them to make the changes? In other words, where are they?
Might be This is because of cache plugin in WordPress site. Try to disable CSS minify setting from the plugin.
You can not change those links or remove it but after disabling minify setting you can modify your CSS. You can then find your correct CSS path in view source.
They are either in your theme or in plugins. Most cases it is in themes. open your theme search for the name...there will be a function enque_script with having those file names as parameter. comment the function which is including your unwanted file.
I am trying to increase the email template width. And I am trying to modify the email-style.php, but it seems no way to change. How can I change it?
Thanks a lot.
The most useful one to copy is emails/email-styles.php and there you'll find the width is defined in two places at 600px; #template-container and #template-body but there's also all the other styles. Anything that is not defined but exists in the email can be added to this file.
I use an email preview plugin so I can see the effect in a web inspector.
if you wanted to be really clever you could include an external css file and then use scss to integrate with the rest of your site styles - eg colours.
The easiest and most common approach to do is to create a folder in your theme called woocommerce/ and then copy the entire templates/ directory from your woocommerce plugin or github into that. This will override the functionality from the plugin.
Here you can find the hardcoded table width.
I've been having trouble implementing templates bought in themeforest in a meteor app.
I'm wondering, what would the best way to implement a template into a meteor app.
Two ways that I think of right now are:
(Tedious way)
Place javascript in Compatibility folder and try to name them in specific alphabetic order in order to get them to work properly.
Place css in client/lib folder and try to name them in specific alphabetic order in order to get them to work properly.
Place fonts and images in the public folder.
The second way (I haven't tested it yet) is to place the template files in the public folder and just link them manually (the old/non-meteor way) in the index.html file.
Now I'm not sure if these are the correct ways to do this and I would like some information regarding this issue.
Thanks!
I've done this myself with a themeforest theme.
Put the theme's css file under /client - it doesn't need to be in /public
Use the class names your theme uses in your templates. Typically a theme will have 3x what you really need so this ends up being much less work than it might seem. If your theme is built on bootstrap then it's even easier.
My theme used fontello a lot for icons, I had to recreate the folder hierarchy under client/fonts and then make sure the cross-references were correct.
Typically themeforest themes don't use js that much, I completely ignored all the js that came with my theme and created what I really needed in Meteor.
Liferay automatically appends the themeId (along with other information such as browser) to the URL when including my portlet's css files. When this happens, I find that not all my css styles are loaded. I try to access the css file directly, using /test-portlet/css/main.css?themeId=classic, and only some of the styles are loaded. When I use /test-portlet/css/main.css without the themeId appended, all the styles are loaded fine.
I have been unsuccessful in finding out why. Can anyone help me with this? I am using Liferay 6.1.1 (6.1 GA2).
Angeline can you tell me where you are including your /test-portlet/css/main.css ?
This main.css file has your custom css specific to your portlet. So to load your css when the portlet is accessed on Page. You need to either include in jsp or the recommended way that is to include below line in your test-portlet liferay-portlet.xml
<header-portlet-css>/css/main.css</header-portlet-css>
This will load your css changes.
Hope this helps !
I had the same issue. Try to rename your css (do not use main.css) and it should work.