I'm trying to get browser-sync to work with my multipress wordpress install, for simpler mobile / responsive development.
Currently I'm having problems in that, my normal development takes place at local.example.com, and browser-sync is proxying this (via 123.456.78.9:3202, as per browser sync).
So far browser-sync loads the site, but none of my scripts or CSS are loading (although images load fine). They jsut fail with no response in the network panel.
I'm using NGINX for hosting the site, as opposed to apache.
Does anyone have any wordpress browser-sync experience? Am I missing something with the browser-sync set up? And tips for this would be super welcome. I'd love to get this as a solid part of my work flow.
The problem is to do with how wordpress handles URLs, in that it normally uses full URLs for including content and links etc.
The proxy is trying to access these on another domain and that's why it's failing.
Update
A much simple, cleaner and maintainable strategy, that also helps with development environments is to use the Root Relative URLs plugin. Adds hooks and configs similar to below, but also updates your content and editors to apply the same structure, so it's a bit more robust
Original Answer
You can add a simple hook (source: wordpress relative urls) to filter wordpress generated urls and remove the base domain so you get relative links to styles and posts etc:
$relative_url_filters = array(
'script_loader_src', //js
'style_loader_src', //css
'post_link', // Normal post link
'post_type_link', // Custom post type link
'page_link', // Page link
'attachment_link', // Attachment link
'get_shortlink', // Shortlink
'post_type_archive_link', // Post type archive link
'get_pagenum_link', // Paginated link
'get_comments_pagenum_link', // Paginated comment link
'term_link', // Term link, including category, tag
'search_link', // Search link
'day_link', // Date archive link
'month_link',
'year_link'
);
foreach ( $relative_url_filters as $relative_url_filters ) {
add_filter( $relative_url_filters, 'wp_make_link_relative' );
}
Which should clean up most of your issues and get browser-sync working nicely.
I'm still having some issues where I have more complex inclusions for images, but more or less it's working and we're already seeing how cool it is!
Related
I have installed Wordpress without making any changes and using the standard 2019 theme. I want to create virtual pages when ever specific url patterns are called. To do this I need to run a URL rewrite as early as possible, so I have added this line to the top of the themes functions.php file:
function url_rewrite() {
die('here');
}
add_action('init', 'url_rewrite');
I get the message 'here' as expected on pages, but if its a URL which does not exist the site is not picking this up at all, it just goes to a 404 page. I'm hoping someone knows why.
I have also tried:
add_action('init', 'url_rewrite', 1, 0);
its working for me perfect, can you please check as you have added code with theme selected and once update your permalink in backend
I am writing a WordPress plugin that has an AJAX element to it - blocks of HTML are fetched by the front end from the plugin using AJAX.
I am having difficulty joining up the pieces here, and I suspect it is just a terminology issue. How would I implement a page completely provided by the plugin?
The content of the page will be HTML - the plugin can generate this in response to POST or GET parameters.
There needs to be a route to this page. The route does not have to be user-friendly or a REST style - just some kind of URI that gets to the plugin. Is there perhaps a way to register a custom page with an arbitrary name, without having to create it as a WP post?
I would like all this to be self-contained in the plugin, so should not involve the administrator having to create posts or pages, or have to add anything to the theme.
Ideally I would avoid any URLs that go into the wp-admin directory. End users don't belong in here.
I would strongly suggest referring to https://codex.wordpress.org/AJAX_in_Plugins#Ajax_on_the_Viewer-Facing_Side
You need to have a php script in your plugin directory that returns what you request, and you need to determine that url at run time for reference in your ajax. The above link gives an example for enqueuing and using wp_localize_script() to provide the url for your custom php script.
wp_enqueue_script( 'ajax-script',
plugins_url( '/js/my_query.js', __FILE__ ), array('jquery') );
// in JavaScript, object properties are accessed as
// ajax_object.ajax_url, ajax_object.we_value
wp_localize_script( 'ajax-script', 'ajax_object',
array( 'ajax_url' => plugins_url( '/php/myapi.php' ));
Your javascript file will be included on every page and will listen for events on the page which require a block of HTML, as you've described it.
Your file myapi.php then needs to take a request, probably using a query string, get the appropriate content from the wordpress api, and respond with said content, which your javascript will put into place.
To have access to the wordpress api as well though, you have two options:
Force wordpress to run starting with your file, by including wp-load.php. This is probably not the cleanest way.
Set up a custom page or slug to direct to your plugin.
I would advise the second option, and advise a slug, in which case you may find this post helpful: wp_rewrite in a WordPress Plugin
From Jason's comment, based on the link above:
The rewrite rules are mentioned a lot, but are really a distraction -
they just help to make URLs look more "friendly", which was not an
objective here. The key is: register a custom GET parameter; look for
that parameter early in the page rendering process; if you find the
parameter is set, then output/echo stuff and die(). There are a
number of hooks that can be used to look at the parameters, chosen
dependin on how much you want WP to set up and process first.
I'm new to wordpress and a bit confused with something. I'm trying to build a classified marketplace type of website for myself. I am NOT building this for a "client". I will probably be using a hack of several different plugins as my coding skills are not up to par. Eventually I will hopefully have lots of users who will be composed of buyers & sellers.
My question pertains to the WP dashboard. When buyers/sellers sign up for my site, will they be able to see the backend WP dashboard? I would prefer that they NOT be able to access a backend dashboard at all let alone a WP branded one. Is this possible? If so any clue as to how this might be accomplished?
thank you Brian
Normal users do not actually see the 'backend' WP dashboard. What they are seeing is a 'profile' type page meant for the original functionality of wordpres; being a blog.
If you do not want users to go to this page when they log-in, you can use a couple of hooks. Here is some code that redirects to the front page after logging-in and logging-out. This goes in your functions.php file.
add_action('login_form', 'ang_redirect_to_front_page');
add_action('wp_logout', 'go_home');
function ang_redirect_to_front_page() {
global $redirect_to;
if (!isset($_GET['redirect_to'])) {
$redirect_to = get_option('siteurl');
}
}
function go_home(){
wp_redirect( home_url() );
exit();
}
And, if your theme is still displaying the menu at the top of the screen that allows the users to go to this 'profile' area, you can go into your footer.php file and remove this:
<?php wp_footer();?>
However, if you do this, then you will not see it as the admin either.
WordPress is might not be the thing to use for that kind of website, even with a bunch of plugins. Read up on other content management systems just incase.
This link might answer your question:
http://buddypress.org/support/topic/how-to-prevent-non-admins-from-accessing-wp-admin-dashboard/
You can also add this to your theme's function.php file:
// DISABLE ADMIN BAR FOR ALL USERS
show_admin_bar( false );
If you are not too used to wordpress, use WOOCOMMERCE plugin. Its completely free and well documented
Here's my issue. My company needs a vendor database added to our wordpress website. None of the existing plugins will even come close to what we need, and we already have a mysql database with all of our information, so we need to create a plugin or something to do what we need.
These urls need to be direct-accessible and have SEF urls. So, for example:
mysite.com/vendors/
mysite.com/vendors/pipe-manufacturers/
mysite.com/vendor/bobs-pipes/
And, the custom content needs to appear inside the wordpress template.
There are really 2 options:
1) Find a way to write our application outside of wordpress, but find a way to bootstrap wordpress to show the header, footer, and sidebar.
2) Run the app from inside wordpress.
So I went for option #2. I created a new template file named "vendor.php", and began working. I added this code to my functions.php of my theme:
add_filter( 'template_include', 'xyz_template_check' );
function xyz_template_check() {
global $template;
$rqst = $_SERVER['REQUEST_URI'];
$ra = split("/", $rqst);
if ($ra[1] == "vendors") {
$template_file = get_stylesheet_directory() . '/vendors.php';
return $template_file;
}
return $template;
}
So what the above code does, if it sees the word "vendors" as the first part of the url after the site name, it sends you to vendor.php. This works PERFECTLY....
except...
Wordpress believes that the page is not found. It returns a 404 header, and NOT FOUND into the page title and breadcrumb.
Adding a PAGE called "Vendor Database" with the permalink "/vendors/" fixes the main page. But there will be literally hundreds of vendors and different categories. I cant be creating a custom page for each one. This needs to be dynamic.
So, how do I make wordpress give a 200, and supply an acceptable page title, breadcrumb, etc.
Don't even get me started on the danged wp_title filter. This did NOT work as documented. Although, it just occurred to me that this might be an issue with Wordpress SEO (the wp_title filter issue).
Anyone got an idea on this?
Ok got this. The solution was to use the rewrite api, as mentioned above, to look for the pattern /vendors/, letting it know that it was a valid URL. Coupled with my existing template override, this is what I needed.
Yesterday I installed a new theme on Wordpress on my self-hosted website. I am aware of the feature that allows you to preview a theme and have used it to select a new Theme that I want to install.
Problem
I do not want to interrupt normal operations of my website, but this new theme requires a lot of customization before it is ready to go. How do I do this?
My Crappy Solution
Is the only way to go about it to run a virtual server on my desktop? This seems tedious, not to mention all the errors I usually get when switching to the "real" server when doing this.
A better way?
I've been searching on SO as well as the WordPress Forum for an answer as to how to do this, but have come up short. I would have thought this is a common question. Maybe I'm using the wrong search terms [themes, customization, before installing]???
Any help is greatly appreciated! Thanks!
Ok, since your question is a pretty good one and probably not a few people are going through the same process when they decide to update their site, I decided to give a try to the get_stylesheet and get_template filter hooks. It turns out that with a very small plugin, you can easily enforce a specific theme(well in this case any logged-in visitor, but you can change this to use any logic you want) according to a specific rule/s.
Here's the code that you need to put in a file in your plugins directory:
<?php
/*
Plugin Name: Switch Theme
Description: Switches the theme for logged-in visitors, while keeping the current theme for everyone else. !!!NOTE!!! Please back-up your database prior using this plugin - I can't guarantee that it will work with any theme, nor that it won't break your site's set-up - USE AT YOUR OWN RISK(I did a quick test and it seemed to be fine, but haven't done extensive testing).
You don't need to switch to the desired theme before that - you want to keep active the theme that you will display to your visitors - the one that you will see will be used programatically.
Before activating the plugin, change the line that says `private $admin_theme = '';` to `private $admin_theme = 'theme-directory-name';` where "theme-directory-name" is obviously the name of the directory in which the desired theme resides in.
*/
class MyThemeSwitcher {
private $admin_theme = '';
function MyThemeSwitcher() {
add_filter( 'stylesheet', array( &$this, 'get_stylesheet' ) );
add_filter( 'template', array( &$this, 'get_template' ) );
}
function get_stylesheet($stylesheet = '') {
if ( is_user_logged_in() && $this->admin_theme ) {
return $this->admin_theme;
}
return $stylesheet;
}
function get_template( $template ) {
if ( is_user_logged_in() && $this->admin_theme ) {
return $this->admin_theme;
}
return $template;
}
}
$theme_switcher = new MyThemeSwitcher();
So - first of all BACKUP YOUR DATABASE! I tested locally with Twenty Eleven being the default theme and a basic framework theme as my custom theme - the theme options and navigation menus were saved properly.
Then all you need to do is to update the file(change the line that says private $admin_theme = ''; to private $admin_theme = 'theme-slug'; where theme-slug is the name of the directory in which the theme you want to use is).
Also - you won't be able to change the Front page and Posts page options, without this affecting the live site, nor will you be able to change the any shared components that both themes use(Site name, Front Page, Posts page, Posts Per Page, etc options, content and so on).
So if you have no clue whether this solution is for you - well, it depends.
If both themes are not relatively complex, then most-likely you should be able to use this hack. If they are though maybe you should do a second installation of your website as others suggested - I think that a second installation in either a sub-domain or a sub-directory would be the best option for you(simply because moving a multisite database is more complex than moving a normal WP database).
I'd setup local apache server with a wordpress installed to customize and test a new theme. When you finished customizing it then you can upload the theme to your live site and activate it. If there are settings that you need to set in the dashboard then you probably will have to adjust them again. That's one way to test/customize a theme before putting it live.
You could create a network (make WordPress multisite with define('WP_ALLOW_MULTISITE', true);, see : http://codex.wordpress.org/Create_A_Network) and then create one sub-site, then turn it "off" with a Maintenance plugin so it is not accessible to users not logged in as admin, export your posts & data from main blog, import them in sub-blog with WordPress default importer, then apply your new theme to this sub-blog and work on it. When everything satisfies you, apply the theme to the main site and deactivate subsite.