How disable a stylesheet in </head> when edit with WP Bakery editor - wordpress

So i have a problem with a code that i added via a WP coder plugin ( a plugin that i can add HTML, CSS JS without coding intern Wordpress)
So the code i add is;
<meta http-equiv="refresh" content="180;url=https://test.link-example.nl/weer/" />
it will redirect in 180s = 3minutes. ( You can guess what happens in a front editor )
The annoying thing is that WPBakery in front-editor mode also redirected within 3 minutes. What i want is when im in the front-editor mode that it not redirect. Only when its in display mode-(just normal web view)
How to fix this?
Perrys.
I tried to make a class and display:none; but that doesn't work.

Related

Can't seem to import bootstrap into wordpress

I am trying to import a page I made in bootstrap into Wordpress and I can't seem to figure it out.
I would like someone to give me some hands-on support if they have the time. I get different results with different attempts.
I changed my index.html to home.php and suddenly the entire site goes down. Restored it again and did something else and then the site showed up without its CSS. i understood i had to create a functions.php file where i call the stylesheets but im not getting any further.
What do i need to do to succesfully import a bootstrap page as theme in wordpress?
You need to create a WP theme, or just a WP page template (in case of just one page.)
https://developer.wordpress.org/themes/template-files-section/page-template-files/
In your current theme, if you have page.php , duplicate it by saying e.g. page-custom.php
In the template header section name the template:
<?php /* Template Name: Example Template */ ?>
Below it add your bootstrap page's code, you may need to fix paths to css/js files but I am sure you will figure that out by googling.
Once you have that page as WP template. Now create a page in WordPress to which you want to apply that bootstrap template.. and in the page edit sidebar, there is section you can select that custom template you created.
see this photo:
https://developer.wordpress.org/files/2014/10/basics-page-templates-03.png
Now if you will visit the page on the front-end , that page will have bootstrap design applied from your custom template.

Bonno WordPress Theme Caching CSS updates indefinitely

Recently I purchased a WordPress Theme called "Bonno" (http://bonno.aisconverse.com/). It's a great theme, but there seems to be one major drawback: Anytime you make a stylistic change to the style.css (via the Appearance --> Editor), the update will not occur.
I've tried:
Shift + R on a browser
Installing a plugin to clear the cache (WP Super Cache)
Making a post on a completely different page via Post/Update (this
sometimes works, other times does not -- not sure how or why)
Has anyone else encountered similar issues on Bonno? Or any other WordPress themes?
To solve this problem your can add extra string right after the filename using a ? character.Edit the theme file to change the link tag.
Example-
<link rel="stylesheet" type="text/css" href="style.css?123">
However it gets static and next time if you change the CSS again you might not get the update instantly. For this, you can use PHP to add the string dynamically by using time() function.
<link rel="stylesheet" type="text/css" href="style.css?<?php echo time(); ?>">
And now you can get instant update of your changes. This will not affect your CSS file.

Linked Stylesheet in WordPress

I am trying to build a second .css file for my company's website.
Currently, we are using a responsive theme, so most of our content displays correctly on desktop and mobile browsers. However, recently the boss is requesting custom code that is unresponsive. In order to keep the site looking good, I want to apply a secondary stylesheet that contains formatting for mobile devices. It would be like this for any html page:
<link rel="stylesheet" href="http://domain.tld/mobile.css" type="text/css" media="handheld" />
I cannot figure out how to get this into a wordpress child theme correctly. Can anyone offer suggestions?
Thank you in advance.
Look for the header.php file in your child theme directory, or under "Appearance"->"Editor" in the main menu of the your Wordpress adminpanel. You can paste the link to your new stylesheet there.
Also consider moving the styles to your theme's directory and replacing the domain in your href with <?php echo get_stylesheet_directory_uri(); ?> (example from wordpress codex).

Wordpress: Simple solution to have mobile devices load a different homepage

I have done quite a bit of googling and have not found a simple solution for a method or a plugin to simply load a different static homepage for mobile devices. Is there a way to do this or a plugin that will do this (without revamping the whole site for mobile devices, as the mobile site style is good, but the specific static homepage is the only thing that I need changed). Wordpress CMS is the platform.
Thanks in advance!
Update:
So I installed the plugin suggested below, copied over an exact copy of the theme I am using but named it with 'mobile' in front just for reference, other than that everything is exactly the same. I read via google that I could add the following code into the functions.php theme file but it just shows up blank when I add the specific code. Code:
//Set Homepage
$mobilehome = get_page_by_title( 'mobilehome' );
update_option( 'page_on_front', $mobilehome->ID );
update_option( 'show_on_front', 'page' );
// Set the blog page
$blog = get_page_by_title( 'Blog' );
update_option( 'page_for_posts', $blog->ID );
Update 2, solved.
I found a simple solution. I created a new theme file 'page-home.php' and changed the css class '#primary' to '#primary-home', then went into the style.css file and added all '#primary-home' css attributes to match '#primary', except on the mobile CSS area of the stylesheet, I added "display:none;" to #primary-home. So now it just doesn't display the homepage on mobile devices, all other pages work (whole point in making the new template page and CSS attribute). I know this fix is probably the simple easy fix but it worked for me!
I found a simple solution. I created a new theme file 'page-home.php' and changed the css class '#primary' to '#primary-home', then went into the style.css file and added all '#primary-home' css attributes to match '#primary', except on the mobile CSS area of the stylesheet, I added "display:none;" to #primary-home. So now it just doesn't display the homepage on mobile devices, all other pages work (whole point in making the new template page and CSS attribute). I know this fix is probably the simple easy fix but it worked for me!
I think that this is as simple as it could get:
Try this plugin - UserAgent Theme Switcher
It will use the user-agent to detect which browser you are on, in this case it could be something like mobile safari or android, etc... then serve the theme based on that.
This could be a hit or miss because you might want or not to change the theme. A more advanced way to do this would be to use a jQuery plugin that checks for the user agent and lets you "do stuff" after you detect it, in this case it could serve as another page or change some CSS.
It's easy and no need to code everything. Install "Redirection" plugin from wordpress repository.
Go to the settings page.
Enter the "Source URL" with your default desktop's homepage
On the "Match" option, select "URL and user agent" & on the "Action" option select "Redirect to URL". Click "Add Redirection".
New configuration option will be appeared. Give any title you want. The "Source URL" must be blank (means that is your base homepage). On the "User Agent" option, choose whether iPhone or Android. On the "Matched" option, set the redirection you want for the mobile homepage.
Done!
You surely can differentiate the homepage on desktop and mobile device based on the redirection you have set before with that plugin. However, you cannot have same url name (ex: www.abcde.com for desktop & www.abcde.com/mobilehomepage for mobile device).

How can I set the main theme-font dynamically, in WordPress

I have created a theme where I already have a custom options page where I let the user set text for footer, twitter user and some other things and that works well.
Now i'd like to add the functionality of letting the user that installed the theme select which font that should be used for content on the site. How can i accomplish this? I can probably create a php file that outputs something like:
<style type="text/css">
body{
font-family: <?php echo get_option('my-font');?>;
}
</style>
and include that file in header.php, but that means that I have to hit php for every request for this css and I want to avoid that if posssible.
Actually, I'd recommend placing that code directly in your header.php file. You'll already be parsing PHP code, so there's no reason you can't parse that get_option() request at the same time. I've used a similar system to generate a random header image on each page load based on WordPress options before as well.
For one theme I built, there were CSS options aplenty, so I decided to generate static CSS files when the user made changes. To get around caching, I would store the timestamp of the last update, and echo it out as a parameter in the CSS URL;
<link rel="stylesheet" type="text/css" href="/path/to/generated/css.css?ver=<?php form_option('theme_name_css_timestamp'); ?>" />

Resources