I'm in the middle of creating a WordPress theme, which I haven't done in a while, and I ran into a problem regarding mobile CSS.
I embed my CSS file in the functions.php file:
function enqueue_my_custom_styles() {
wp_enqueue_style( 'stylesheet', '/assets/main.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_my_custom_styles');
This seems to be working absolutely fine and when I check if the file is linked in a browser, it is showing. However, when I look on my mobile, I can only see basic HTML markup with working Bootstrap 5.0, which is embeded in the header.php file ( I have already tried embedding the CSS into the header.php file, same results)
Is there a specific function that I overlooked or is the problem somewhere else? Thank you.
/* Some time css not working on specific mobile device because third party library impact on your current page or any wordpress plugin install on your website then so you can using media queries and set your target apply on specific device. */
You can used different css for chrome , firefox , safari brower etc.
For more details visit below links
https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
1. Css functionality is wp default option – so this is not theme related issue, if you are using any caching plugins or any other caching solutions clear them before checking on mobile.
2. Make sure to clean the mobile cache before checking (every time you make CSS changes)
Related
Recently, when I view a page in Wordpress Preview mode, it always loads the default template (theme page.php file) whereas when I look at the published page, it's the right template. I have around 10 different templates for my pages. Just keep in mind that I'm not talking about the theme itself, but the Wordpress template structure. I included three pictures. The admin panel one, shows different templates for my page.As shown, I chose Fixed-Width Clean Page. The second picture shows the page in Preview mode.As you can see it includes a sidebar which is included in the default template but not the one that I chose. And the last picture is the Live view of the website which is correct. As you can see the sidebar doesn't exist. I searched all over the internet and did some suggestions, but none of them work (like saving the permalinks again, changing the theme and changing it back again, etc). The only change that I recently made was upgrading to Wordpress 4.7.4 and blocking access to admin panel by ip using .htaccess file (I removed the .htaccess file, but still no luck). Any suggestions would be appreciated.
OK, after some time I figured out what the problem was. The "WP Subtitle" plugin version 2.9, breaks the preview functionality if you have multiple templates. I report the issue to them as well, but posted the answer if somebody came across the same problem. In order to fix the issue temporarily, i commented out the below line (line 74) on the plugin's main file (wp-subtitle.php):
//add_filter( 'the_preview', array( 'WPSubtitle', 'the_preview' ), 10, 2 );
I'm running into a bunch of problems with a 'premium' WP theme I purchased. The developers aren't being a very big help besides 'it should work' and 'it works for other people' so I'm just trying to figure it out myself.
Chrome's Dev tools have been my biggest friend so far. The problem I am having with this theme is that my style changes aren't being applied. Now there are three different locations where I could do this. One is style.css another one is custom.less and the 'quick css' box that comes packaged with the theme. Neither of these options work - sometimes some changes will be applied from style.css - but most of the time my changes are not applied. I have started digging in the source (parent) files and started changing those and again - no change.
Now I found out with the help of chrome's devtools that the header file refers to the stylesheets with version numbers. The moment I removed the version number from fw-style-css all my changes were fed through immediately. Now I would like to know where in WP I will have to start digging to get to the header part where I can change the stylesheet details. I already looked up header.php but it refers to and I have no clue what to do after this.
The website in question is just a testing environment until I have everything sorted out, then I will port it over to my main site. The website in question is http://dev.amyranth.com/
If the stylesheet files aren't directly linked in the header.php file, then the stylesheets must be included via the wp_enqueue_style function. Example:
<?php wp_enqueue_style( $handle, $src, $deps, $ver, $media ); ?>
The fourth parameter is "version" which is most likely what you saw in the source code. You should change this every time you make a change to the stylesheet because it will help with browser caching by forcing the browser to download a new version of the file. Otherwise, it will assume that the old cached copy of the stylesheet is still valid.
Update:
The best way would be to do what #ViperCode suggested and create a new stylesheet, then add it to the theme with wp_enqueue_style.
In fact, the very best way would be to create a child theme which extends the premium theme you are trying to customize. That way your changes would be maintained separately and would not be overwritten by theme updates.
The easiest solution would be to search your theme's directory for the function name wp_enqueue_style
I’ve been experiencing a problem that I was hoping someone could point me in the right direction. In an effort to make my website more mobile friendly, I purchased a mobile responsive theme. While I know I could have created a sub-domain or a directory to house the mobile version of the website, I’ve been attempting to have the original domain http://example.com switch themes based on the user. In other words, for http://example.com, Desktop user views DesktopTheme and Mobile user views MobileTheme. With the Any Mobile Theme Switcher plugin, I was able to accomplish this will little issue. However, for certain pages I would like to be able to display the desktop version to the mobile user. For example, for single posts, I would like the desktop user and the mobile user both to see the DesktopTheme.
Unfortunately, after several hours of searching and experimenting I am not further along than when I started. Using different templates appeared to be an option, but it’s not a true theme switch. When I altered the template files, mobile users received a hybrid version of the site that includes the mobile header and an unstructured version of the desktop version. A similar result was achieved when I simply copied the single.php file from DesktopTheme into the folder for MobileTheme.
Example:
<?php get_header('/var/www/html/wp-content/themes/DesktopTheme/header.php'); ?>
Any ideas?
There is a plugin that you can use for switching themes based on the post type as well as a lot of other conditions:
http://codecanyon.net/item/wordpress-theme-switcher/558740
I'm not aware of any free version that offers the same functionality, but that doesn't mean one doesn't exist.
With that said, I think you should reconsider your approach here. The entire point of responsive design is so you do not have to have separate mobile and desktop sites. I think you should sidestep this entire issue by using the responsive theme everywhere.
Using a single responsive theme is going to make maintenance much easier and give the user a more consistent experience.
Also, get_header is meant to load a header file from the current theme. You can't load components from other themes and expect them to work correctly.
I am having problems trying to figure out how exactly i can edit a simple page of the website. I didn't initially create it so i am given the task of trying to understand someones code. So the problem is... i am trying to change the simple font colour on the front home page, but i cannot even find the CSS file on magento or Wordpress so i'm kind of confused. I want to change the white font colour to black.
Do i just log in with FTP and edit the pages manually on there? Please give me some information on how i can go about editing any pages at all.
Wordpress
Wordpress have /wp-content/themes/ for a directory which stores all instaled themes (downloaded or created by you). You can edit everything of a theme there. The default stylesheet file in wp's /wp-content/themes/[yourtheme]/style.css. Attention: this CSS file can import another from somewhere else.
Finding the style
You can find the ids and classes statements just positioning the mouse over the element that you want to discover what is influencing it, right button click and select Inspect Element if in Chrome or Mozilla. An add-on to help is Web Developer.
Possibly useful links: http://ithemes.com/tutorials/ ; http://mcbuzz.wordpress.com/wordpress-tutorials-complete-list/ ; http://themeshaper.com/2009/06/22/wordpress-themes-templates-tutorial/ ; http://line25.com/articles/15-tutorials-to-help-you-build-wordpress-themes
Web developer
Mozilla | Chrome
#edit Yes, you can edit via FPT or SSH connection ;P
In wordpress you should check in settings->reading what the front page is set to and css changes can be done in the theme folder wp-content/themes/theme_name/ and for magento the css is usually in /skin/frontend/package/theme/css. or somewhere close depending on the template.
I've created an HTML page as part of my website which I would like to use as a template for news articles. The page has all the things it needs, it just needs to display the correct news article in it.
I installed WordPress on my webserver and now wonder how I can have wordpress publish articles using my HTML page?
Is this even possible since WordPress works with php?
thanks
What you are talking about is themes. Wordpress allows you to create a theme for your installation so it displays using your html/css (more or less)
The way I do this is copy the default theme and make changes in there, and then you can switch to your new theme in your settings.
Edit: in addition, you can also load up wordpress on any page using:
include( '/path_to/wordpress_install/wp-load.php' );
This will allow you to use wordpress functionality on any page of your site.
just edited the single.php file by pasting the desired html code and leaving the loop code there where the text needed to show up.
didn't need to break up the page in a header, body and footer. Left out sidebar for now, but will put it back after I edit it properly.