de-activating Wordpress plugin "Jetpack", all oPinterest embeds become broken - wordpress

When I de-activate the Wordpress plugin called "Jetpack", ALL of my thousands of Pinterest embeds become broken.
The thing is, Wordress Gutenberg blocks have a Standard Pinterest block, but since I had Jetpack installed for so long, all of my Pinterest embeds are handled by the Jetpack plugin.
But I want to delete this plugin for pagespeed reasons.
But when I de-activate the plugin, all my Pinterest embeds simply become PLAIN URL's on my site, which is obviously a big problem for the visitors.
Now, is there a way to MASS-edit all of these Pinterest embeds to use the Gutenberg Pinterest block instead?
I hope there's a way to do this. I'd be willing to pay for a solution even.

Unfortunately, there isn't a simple way to mass-edit all of your Pinterest embeds to use the Gutenberg Pinterest block. You would need to manually go through each post or page that contains a Pinterest embed and replace it with the Gutenberg Pinterest block.
One option could be to use a plugin that allows you to search and replace text in your WordPress posts and pages. You can use this plugin to search for the Jetpack Pinterest embed code and replace it with the Gutenberg Pinterest block code. However, be cautious when using a plugin for this as it could potentially break your website if not used correctly.
OR
Another option would be to write a custom script to perform this task. You can try the following code and see if it works:
<?php
// Get all posts and pages
$posts = get_posts(array(
'post_type' => array('post', 'page'),
'posts_per_page' => -1
));
// Loop through all posts and pages
foreach($posts as $post) {
// Get the content of the post or page
$content = $post->post_content;
// Check if the Jetpack Pinterest embed code is present in the content
if(strpos($content, 'data-pin-do="embedPin"') !== false) {
// Replace the Jetpack Pinterest embed code with the Gutenberg Pinterest block code
$content = str_replace('data-pin-do="embedPin"', '', $content);
$content = str_replace('<a data-pin-do="embedPin"', '<!-- wp:pinterest/embed-pin -->', $content);
$content = str_replace('></a>', '<!-- /wp:pinterest/embed-pin -->', $content);
// Update the post or page with the new content
wp_update_post(array(
'ID' => $post->ID,
'post_content' => $content
));
}
}
?>
Please note that this is just a basic example, and there may be some variations in the Jetpack Pinterest embed code that would need to be accounted for in the script. It's also important to thoroughly test this script on a staging environment before running it on a live site.
As a general rule, it's always a good idea to make a backup of your website before making any changes, especially ones involving code.

Related

Unable to use video in custom-header

Under theme customisation, I'm unable to set a video as the Header Media. This theme is being created from scratch so I've currently only got the following files: header.php, footer.php, functions.php, sidebar.php, index.php
I've tried setting video to true in the theme support section for wordpress. I've tried copying the implementation in the twentyseventeen theme.
I've tried different combination of parameters in the custom-header theme support function.
functions.php:
add_theme_support( 'custom-header', array(
'video' => true,
) );
header.php:
<?php the_custom_header_markup(); ?>
Wordpress is currently giving me the following error:
"This theme doesn’t support video headers on this page. Navigate to
the front page or another page that supports video headers."
In my functions.php I was loading jQuery like the following:
wp_enqueue_script('wptheme-jquery-js-cdn', 'https://code.jquery.com/jquery-3.3.1.slim.min.js');
This caused jQuery to load first. To solve this, I forced it to be loaded in the footer.
wp_enqueue_script('wptheme-jquery-js-cdn', 'https://code.jquery.com/jquery-3.3.1.slim.min.js', array(), '', true);
This is also better practice to stop it blocking rendering.

Embedded Wordpress form plugin shortcode not displaying in page

I currently creating a Wordpress custom theme with the Ninja Forms plugin, for one of the pages Ive embedded the Ninja Form using the shortcode such as [ninja_form id=2] and Ive inserted the post directly into the inner page as such
$id = $_GET['page_id'];
$post = get_post($id, 'OBJECT', 'display');
//display the post
echo '<h1 class="dark">'.$post->post_title.'</h1>';
echo $post->post_content;
But the embedded form shortcode doesnt resolve to actually load the form into the page. What Im not doing??
try checking your Javascript files and CSS files that it doesn't affect the plugin you are using, because some of javascripts and JQueries overrides on the plugins you are using.

How Create Responsive One Page WordPress Theme with scrollable effects?

Where can I find a soucre that learn to create a Responsive One Page WordPress Theme so when I click on the menu item it scroll down.
Here is an example of what I want http://thememints.com/templates/?theme=Cingle%20WP.
I have had exactly the same question and after searching around found this post.
I was rather shocked to see the responses to this question. It seem to me like people are quick to answer questions without properly reading the question.
All the contributors have given solutions to responsive and parallax scrolling websites but not one has answered the real question.
It is not too broad, and it is not vague. All he is asking is how you go about creating a Single page theme in WORDPRESS.... no one gave any direction as to how to accomplish this.
Not sure why these answers got rated as usefull .
So after digging around with trial and error I found the following to answer the question as to how you go about to create a single page WORDPRESS theme.
One of the major aspect to understand is the Wordpress query-post function which allows you to post multiple page content such as home , about, service and content onto a single page.
To create the the menu structure to scroll to the different sections I found this tutorial to be usefull - create-a-single-page-wordpress-website
I hope this helps
As William Patton said this is a broad question but as far I can understand this may help :
http://www.designerledger.com/parallax-scrolling-tutorials/ for the one page theme.
and a basic start for wordpress development theme :
http://codex.wordpress.org/Theme_Development
Update : I found this awesome plugin that helps you create full screen pages
https://github.com/alvarotrigo/fullPage.js
EDIT 2016
Due to the many up votes at user3263807 answer I made a small/basic one page guide for wordpress. For css/js there are plenty good tutorials and plugins over the internet. Also I assume you are familiar with WordPress Themes.
First of all you should create a template file for your one page. Let's call it template-one-page.php. The template name, commented inside the file, is the name that will appear in Page Attributes -> Template when you creating a page inside admin panel. After that create a page, ie Home, and assign as template your template. If you want your page to appear as front page (when you enter mydomain.com this page will be shown) go to Setting->Reading->Front page displays->A static page and set as front page your page.
// File Security Check
defined('ABSPATH') OR exit;
/*
Template Name: One Page
*/
?>
Normally a one page has sections. So we want to decide what type of sections we want. It could be pages, child pages, posts, custom fields (like a repeater from ACF) etc.
<?php
$id = get_the_ID(); // The page id
$sections = get_posts(array('post_type' => 'page', 'post_parent' => $id)); // get all child pages
foreach ($sections as $key => $section):
?>
<section id="page-<?php $section->ID; ?>" <?php post_class('', $section->ID); ?>>
<h1><?php echo get_the_title($section->ID); ?></h1>
</section>
<?php endforeach; ?>
Or with a Loop
<?php
$id = get_the_ID(); // The page id
$query = new WP_Query( array('post_type' => 'page', 'post_parent' => $id) ); // get all child pages
if($query->have_posts()):
while ( $query->have_posts() ) : $query->the_post();
?>
<section id="page-<?php the_ID() ?>" <?php post_class(); ?>>
<h1><?php the_title(); ?></h1>
</section>
<?php endwhile; wp_reset_postdata(); ?>
<?php endif; ?>
You can query what ever you want depending the need of your site.
you should take look at below link:
[1] http://www.1stwebdesigner.com/css/responsive-website-tutorial/
[2] http://www.1stwebdesigner.com/css/create-a-responsive-website-video-tutorial/
[3] http://readwrite.com/2013/04/16/10-developer-tips-to-build-a-responsive-website-infographic#awesm=~okrhufNGLHp1mh (Best one to keep points in mind while creating )
Thanks.
Here is full detailed video tutorial that deals with setting a one-page scrolling Wordpress website from any theme you want. Need to join - there is a free trial. This allows you to "peek under the hood" and understand the principle of how the other one page themes and plugins were created.
http://www.lynda.com/WordPress-tutorials/WordPress-Building-One-Page-Style-Site/169876-2.html
I have looked into several ready-made themes, such as Onesie and OneEngine, and found them a nightmare to manage on the back end, very user unfriendly. The content of the long home page with several sections in both themes is managed not through the Pages section, like one would assume, but through a different admin section in the Appearance folder, with none of the usual Wordpress interface controls. The tutorial above deals with it properly, with the real Wordpress Pages assembled by a custom loop on the front page and menus working in the same way as built-in Wordpress menus.
I used localscroll and scrollTo jquery plugin in my one page theme, it's working fine.
The plugins link:http://flesler.blogspot.com
After you imported the jquery and plugins files into your page, just call the function like below, then if you click a anchor link, the page will scroll up or down smoothly.
$.localScroll({
target:'body',
duration:1000,
queue:true,
hash:true,
easing:'easeInOutExpo',
offset: {left: 0, top: -55}
});

Seo yoast plugin, breadcrumbs

This is question on the seo yoast wordporess plugin.
I have a friend who doesn't know that much about code/wordpress/etc, they have an ecommerce site built using magento and a blog using wordpress which is styled to match the main site and they use yoast seo plugin for seo etc. They have asked me to try an get the breadcrumbs working for them in a different way to what i know, from what i can see they want to add a prefix to the breadcrumbs 'home' which links to main site then renaming the blog from home to blog, for example home(main site) > blog(blog) > post.
Now i did just that in the plugin settings but they said that the schema markup wouldn't be complete and said there’s a filter hook called ‘wpseo_breadcrumb_links’ which gives access to the array of URLs and anchor text used to build the breadcrumbs, now i cant find anything on google that explains this or how to start writing it, i do know that it needs to go in the functions file.
Would it be possible to get some help on this.
Thanks in advance and very much appreciated.
Justin
I'm not sure what Schema.org markup has to do with breadcrumbs! :) Schema is used on post/page level. So, they are either oversmarting themselves or I got you wrong.
I think this sample code may be helpful:
add_filter( 'wpseo_breadcrumb_output', 'custom_wpseo_breadcrumb_output' );
function custom_wpseo_breadcrumb_output( $output ){
if( is_product() ){
$from = '<span typeof="v:Breadcrumb">Products</span> »';
$to = '';
$output = str_replace( $from, $to, $output );
}
return $output;
}
It looks like wpseo_breadcrumb_output gives you access to the entire output instead of just the link portion. Please see this page for more details: http://wpquestions.com/question/showChrono/id/8603

Wordpress widget/plugin - content based on text of post(s)/page(s) visible?

I'm new to the Wordpress plugin and widget APIs, but I'm sure this is possible.
I'd like to make a plugin or widget that would create links to other posts or external sites based on certain keywords/tags in the content of the given page/post.
Is this possible?
For example, if a term is in all-caps, link to the Wiktionary definition; inside a <news>..</news> pair, go to Google's news search; etc.
This is definitely possible. Don't bother looking into the widget api for this. Look at the filter api. WordPress has an api that allows you to filter content before it's sent to the browser. In this case, you'd do something like this:
function my_super_awesome_content_filterer( $content ){
$content = preg_replace( '#([A-Z]+)#', '$1', $content );
}
add_filter( 'the_content', 'my_super_awesome_content_filterer' );
Read more about filters here:
http://codex.wordpress.org/Plugin_API#Filters

Resources