Adding AMP pages to Wordpress manually without a plugin - php

I need to code my AMP Pages manually, and add them to my Wordpress site so I can make sure they are perfect. All the plugins I've used have not done everything I need, and cause errors in Search Console.
I've already created a child theme to play around in, and have been attempting to add a new PHP page template, but no luck!
The reason I'm coding manually is to
add proper structured data
amp-analytics code and
make sure everything will be indexed properly.

Have you tried this?
define( 'AMP_QUERY_VAR', apply_filters( 'amp_query_var', 'amp' ) );
add_rewrite_endpoint( AMP_QUERY_VAR, EP_PERMALINK );
add_filter( 'template_include', 'amp_page_template', 99 );
function amp_page_template( $template ) {
if( get_query_var( AMP_QUERY_VAR, false ) !== false ) {
if ( is_single() ) {
$template = get_template_directory() . '/amp-single.php';
}
}
return $template;
}
Source link.

We just created a AMP Template page outside of the WordPress environment. Programmed it with PHP/HTML. This makes the Fastest, Google Verified AMP page. Then just link to it from inside WordPress.
Note: We created sub-directories outside of WP to hold the AMP pages for better design control. Just watch out for the "Slug vs. sub-directory" name conflicts that will arise.
We also looked at all the AMP plugin, they are garbage as of 4/1/2017. They have to high of a code overhead to be SEO competitive. That overhead makes the page slower and a now WP AMP concept.

Related

Setting Wordpress front page as Algolia search

I've recently setup a new Wordpress install to act as a survey database. The purpose of the site is to collect survey data and allow the admin's to filter and search submitted survey data.
I've installed and configured the Algolia search WP plugin. Everything is working properly. If I navigate to 'mydomain.com/?s=' I see the search form and it's returning results.
My question is how can I set the Algolia search page as my Wordpress index/front page? Or, how can I import this form to a page that I can designate as my WP static front page?
Further info: I have a child theme installed and can create custom page templates/template-parts
The reason is this code here...
if ( is_search() && $settings->should_override_search_with_instantsearch() ) {
return $this->load_instantsearch_template();
}
from this file
https://github.com/algolia/algoliasearch-wordpress/blob/1a51d3e2e8be12bfcbccd1ef2a722911a99376e7/includes/class-algolia-template-loader.php
Essentially it isn't being loaded at present where you want.
Putting this code in your functions.php will fix it.
add_action( 'wp_enqueue_scripts', function () {
// Enqueue the instantsearch.js default styles.
wp_enqueue_style( 'algolia-instantsearch' );
// Ensure jQuery is loaded.
wp_enqueue_script( 'jquery' );
// Enqueue the instantsearch.js library.
wp_enqueue_script( 'algolia-instantsearch' );
// WordPress utility useful for using underscore templating.
wp_enqueue_script( 'wp-util' );
// Allow users to easily enqueue custom styles and scripts.
do_action( 'algolia_instantsearch_scripts' );
} );
Then just add the instantsearch.php code or include the file to the index page/page you want to load it on.
(I just replaced the index.php code with the code from instantsearch.php and it worked just fine)
Hope that helps.

Wordpress plugin - how to disable js/css per page

With Wordpress you have good/bad plugins, some being much more economical than others. By economical I mean that they only call the CSS and JavaScript required for the function when the page is loaded where that function is enabled. Others don't discriminate and call the code on all pages. This can have a negative effect on page load speed/performance.
I have some plugins that are heavy in CSS and are laden with reems of jQuery/Javascript files - I only want them to be enabled on particular pages (not home). In hand I have the page ID and alias. Looking in the plugin folder I also see the main php file that includes all the JS / CSS. Within that file I tried something like is_page() but it seems to have no impact as if is_page has not yet been set.
<?php if ( is_page( '3486' ) ) { exit; } ?>
exit on a line by itself kills the page indicating that the script is being called.
The question, "How and where do you place an if statement that will prevent the plugin CSS/JavaScript from being called on all pages but a particular one (or perhaps an array of pages)?
I could name the plugin but the question is really more generic to any plugin.
You can use wp_deregister_script, this will remove unwanted JS,CSS from specific pages.
add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );
function my_deregister_javascript()
{
if ( is_page('YOUR PAGE NAME') )
{
wp_deregister_script( 'WORDPRESS JS file NAME' );
}
}
Refer : https://codex.wordpress.org/Function_Reference/wp_deregister_script

Adding a PHP page to Wordpress via Plugin

Pretty much every guide ive come across for adding php pages to Wordpress involves adding it at the theme level. e.g. How to add a PHP page to WordPress?. I want to add a new public facing page to multiple sites via a plugin. I dont want to have to add this to dozens of themes. If i can add it ad the plugin level it will work for all sites.
I have this working, but i need some way of injecting this into a theme. In order to get the sidebar and stuff without having to add custom css for each theme.
Ive started by adding a rewrite rule
RewriteRule ^mypage /wp-content/plugins/myplugin/mypage.php [QSA,L]
Then page.php contains
require_once('../../../wp-blog-header.php');
get_header();
//custom php content
//get_sidebar(); // how to get this working.
get_footer();
This also works, but the problem im having is with sidebars. Some themes dont have them and others do. Not all sidebars are 30% etc. I dont know how to build the div structure here to make it work. Some themes are 100% page width, but this looks ugly when viewed on other themes that are a fixed width. I have been able to come up with some compromises, but id rather be able to do this right.
In summery my main question here is. Is it possible to call a method that will inject html into a theme page. e.g. generate_page($html);. This method will then go to page.php of the theme and inject $html into the content area of the theme.
Edit
In an attempt to dynamically inject content into an unknown theme ive done the following
global $post;
$post->post_content = "TEST PAGE content";
$post->post_title = "Page Title";
$post->post_name = "test-page";
include get_template_directory()."/page.php";
This works for some themes and not others. Some themes will display this post just fine, but others (the default wordpres twenty fifteen theme) are displaying this post and then every other post in the database after it. Im not sure where or why its pulling all of these posts, but if i can get it to stop it looks like this will be a valid solution.
Then u could try to load a specific template page in specific case.
function load_my_template( $template )
{
if( is_page() )
$template = plugin_dir_path(__FILE__) . "dir_to/my_template.php";
return $template;
}
Or change the content that is use on loading page
function load_my_content( $content )
{
global $post;
$id = $post->ID;
if( is_page() )
{
ob_start();
include plugin_dir_path(__FILE__) . "dir_to/my_template.php";
$content = ob_get_clean();
}
return $content;
}
In your __construct()
add_filter('template_include', array($this,'load_my_template') );
add_filter("the_content", array($this,"load_my_content" ) );
add_filter("get_the_content", array($this,"load_my_content" ) );
Hope that help u.
Tell me if it's not corresponding with your question.

Integrating FullPage.js as a Wordpress Plugin: Can I adjust this plugin to work along side other plugins?

I recently followed this post on integrating FullPage.js as a WordPress plugin.
I'm having trouble getting the plugin to work with other plugins - such as "All in one Event Calendar". The calendar works it just won't display on pages using FullPage.js
I understand the limitations that a plugin meant for landing pages has, but I was wondering if there was any way to edit the existing FP plugin template so that it can utilize other plugins while also taking over the theme's template?
Perhaps editing this statement?:
function fullpage_template( $original_template ) {
if ( get_post_meta( get_the_ID(), 'fullpage_js', true ) ) {
return dirname(__FILE__) . '/templates/fullpage.php';
} else {
return $original_template;
}
}
I really appreciate any assistance on this!
You might be having problems because you are using verticalCentred:true or scrollOverflow:true.
As said in the fullpage.js FAQs
My other plugins don't work when using fullPage.js
Short answer: initialize them in the afterRender callback of fullPage.js.
Explanation: if you are using options such as verticalCentered:true or overflowScroll:true of fullPage.js, your content will be wrapped inside other elements changing its position in the DOM structure of the site. This way, your content would be consider as "dynamically added content" and most plugins need the content to be originally on the site to perform their tasks. Using the afterRender callback to initialize your plugins, fullPage.js makes sure to initialize them only when fullPage.js has stopped changing the DOM structure of the site.

Using require_once() in functions.php ONLY when WooCommerce plugin is activated

I'm using the Genesis Framework/WordPress. For theme development, I'm keeping my functions organized by fragmenting similar functions in my theme's /lib/ folder as includes and then using require_once() to include those functions in the appropriate order in functions.php. I'm aware of the performance considerations for this approach for highly dynamic sites and want to note this is for prod and staging only.
I have a collection of Woocommerce functions that I only want loaded when the WooCommerce plugin is activated. Below you can see the conditional statement that I've tried to construct in functions.php that would force wordpress to load this only when the plugin is activate. I'm admittedly new to PHP development and am having trouble discerning whether this is a method issue, syntax issue or both:
if ( ! function_exists( 'is_woocommerce_activated' ) ) {
function is_woocommerce_activated() {
if ( class_exists( 'woocommerce' ) ) {
require_once( CHILD_DIR . '/lib/cg-woocommerce.php' );}
else return; }
}
The stylesheets that I have enqueued in my woocommerce.php functions include are still being output in WP_head, which I'm assuming means that the conditional isn't working. Any ideas here or direction on how to troubleshoot?

Categories