Categories
Code Snippets Javascript JQuery SquareSpace Wordpress

SquareSpace | WordPress | CMS Friendly | Scroll to Top Button

In this tutorial, we’ll be adding a Scroll to Top button to the website. These steps will work for SquareSpace, WordPress and any other CMS.

See it in action here: https://billmuirhead.com

First, let’s add the button to the body of the page.

Get the identifier on your header element, it may be on the <nav> element on something similar which lives on the top of each page.

In this case we’re using #site-header where we have a div with id = site-header.

Be sure to add the code below to the body element in such a way that it will show on each page such as the header or footer.

<a class="to-the-top" href="#site-header">
    <span class="to-the-top-long">
    To the top <span class="arrow" aria-hidden="true">ā†‘</span>
    </span><!-- .to-the-top-long -->
    <span class="to-the-top-short">
        Up <span class="arrow" aria-hidden="true">ā†‘</span>
    </span><!-- .to-the-top-short -->
</a>

Next, let’s add the javascript/ Jquery to add the scroll to top functionality to the button. It will the button when we’re already at the top!

First, add the following Jquery script tag to the Footer section to make sure Jquery is enabled:

<script src="https://code.jquery.com/jquery-3.6.0.slim.min.js" integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI=" crossorigin="anonymous"></script>

Following that, add the Scroll to Top javascript code also to the Footer section immediately after the Jquery script above.

jQuery( document ).ready(function() {
    
            
    jQuery(window).bind('scroll', function() {
            
            wrap = jQuery('body');
            scrollTop = jQuery(window).scrollTop();
        
            distance = 50;
            console.log("slide height!");
                                     
            if (scrollTop > distance)	{
                wrap.addClass("fixed");
                jQuery( ".to-the-top" ).show();
            } else {
                wrap.removeClass("fixed");
                jQuery( ".to-the-top" ).hide();
            }		
        
    });	
    
    
    jQuery( ".to-the-top" ).click(function() {
        
        document.body.scrollTop = 0; // For Safari
  		document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
        
    });
    
});

Video explanation for implementing on SquareSpace :

Categories
Code Snippets PHP Wordpress

Redirect to shop if cart is empty

function cart_empty_redirect_to_shop() {
    global $woocommerce;
    
    $shop_page_url = get_permalink( woocommerce_get_page_id( 'shop' ) );

    if ( is_page('cart') && !sizeof($woocommerce->cart->cart_contents) ) {
        wp_redirect( $shop_page_url, 301 ); 
        exit;
    }
}
# -*- coding: utf-8 -*-
"""
Created on Sat Apr  3 14:12:04 2021

@author: KG
"""

# Import modules
import pandas as pd
import math
from pulp import *

# Define variables
current_cost = 0.0
food_dict = {}

# Load food data into food pandas dataframe
food = pd.read_excel('diet.xls', skipfooter=3)

# Get a preview of our food dataframe
print(food)

# Create a list of Protein food choices
protein_list = ['Roasted Chicken', 'Poached Eggs', 'Scrambled Eggs', 'Bologna,Turkey', 'Frankfurter, Beef', 'Ham,Sliced,Extralean', 'Kielbasa,Prk', 'Pizza W/Pepperoni', 'Hamburger W/Toppings', 'Hotdog, Plain', 'Pork', 'Sardines in Oil', 'White Tuna in Water', 'Chicknoodl Soup', 'Splt Pea&Hamsoup', 'Beanbacn Soup,W/Watr']

# Load minimum and maximum values into the min_max table
min_max = pd.read_excel('diet.xls', skiprows = food.shape[0]+1, usecols=("C:N"), header=0)
column_names = pd.read_excel('diet.xls', usecols=("C:N"), nrows=0)
min_max = pd.DataFrame(data=min_max.values, columns=column_names.columns)

# Get a preview of our min_max file
print(min_max)

# Convert our food dataframe to a list
food_data = food.values.tolist()
food_list = [x[0] for x in food_data]
    
# Create the Optimization Problem
prob = LpProblem('DietProblem', LpMinimize)

# Create the variables using LpVariable.dicts
food_vars = LpVariable.dicts( "Food", food_list, lowBound = 0 ) # for food variables
food_chosen = LpVariable.dicts("Chosen",food_list,0,1,cat='Integer') # for chosen foods
protein_chosen = LpVariable.dicts("Protein",protein_list,0,1,cat='Integer') # for protein foods chosen

# Add the Objective Function for cost
costs = {x[0]:x[1] for x in food_data}
prob += lpSum( costs[i] * food_vars[i] for i in food_list )

# Add each variable to the Optimization Problem by looping over the min_max dataframe
for v in range(len(min_max.columns[1:])):
    
    # Get the variable name from the min_max dataframe
    variable = min_max.columns[1:][v]
    
    # Add the variable to the Optimization Problem
    food_dict[variable] = {x[0]:x[v+3] for x in food_data} 
    prob += lpSum( food_dict[variable][i] * food_vars[i] for i in food_list ) >= min_max[variable][0] # >= min value for the variable
    prob += lpSum( food_dict[variable][i] * food_vars[i] for i in food_list ) <= min_max[variable][1] # <= max value for the variable
        

# Add the Constraint where each food much be atleast 1/10 of the total serving
for f in food_list:
    prob += food_vars[f] >= food_chosen[f] * 0.10


# Add the Constraint of selecing either Celery or Frozen Broccoli
prob += food_chosen['Frozen Broccoli'] + food_chosen['Celery, Raw'] <= 1

# Add the Constraint of selecting atleast 3 choices from the list of Protein items
prob += lpSum([food_chosen[p] for p in protein_list]) >= 3

# Store the solution of the Optimization Problem
soln = prob.solve()

# Get the Status of the Optimization Problem
print( LpStatus[prob.status])

# Get the Amounts of the Foods Chosen 
for v in prob.variables():
    if v.varValue != 0:
        print( f"{v.name} = {v.varValue:.2f}")

# Get the Final Cost of Food Chosen
print(f"Cost: {value(prob.objective)}")

 

Categories
CSS Wordpress

Remove image zoom feature from woocommerce products

function remove_image_zoom_support() {
remove_theme_support( 'wc-product-gallery-zoom' );
}
add_action( 'wp', 'remove_image_zoom_support', 100 );

 

Categories
Blog Code Snippets Wordpress

Remove the word “Archives” from the Archive Page Title

Add this to functions.php

function grd_custom_archive_title( $title ) {
// Remove any HTML, words, digits, and spaces before the title.
return preg_replace( '#^[\w\d\s]+:\s*#', '', strip_tags( $title ) );
}
add_filter( 'get_the_archive_title', 'grd_custom_archive_title' );

Or use:

function override_page_title() {
return false;
}
add_filter('woocommerce_show_page_title', 'override_page_title');

 

Categories
Blog Code Snippets PHP Wordpress

Remove DNS-Prefetch Links on WordPress Site Without Plugin

// Remove dns-prefetch Link from WordPress Head (Frontend)
remove_action( 'wp_head', 'wp_resource_hints', 2 );

 

Categories
Blog Code Snippets PHP Wordpress

WordPress Plugin Error – Notice: Trying to get property of non-object in…

I’m getting this error in relation to the ‘Grid & List toggle for Woocommerce’ plugin, specifically this file:

/wp-content/plugins/grid-list-toggle-for-woocommerce/woocommerce_grid_list.php on line 115

 

Basically, the error was corrected by surrounding the code after global $post with the following statement:

if ( is_object( $post )) {

Categories
Blog Code Snippets PHP Wordpress

Display Product Categories with Thumbnail Image

Use shortcode: [show-product-categories-with-image]

Add the following to your functions.php file.

function showProductCat() {

$cat_args = array(
'orderby' => 'name',
'order' => 'asc',
'hide_empty' => true,
);

$product_categories = get_terms( 'product_cat', $cat_args );

$result = "<div class='product-categories-with-image'>";

if( !empty($product_categories) ){

foreach ($product_categories as $key => $category) {

$thumb_id = get_woocommerce_term_meta( $category->term_id, 'thumbnail_id', true );
$term_img = D0d_get_attachment_image_src( $thumb_id, 'thumbnail', true );

$cat_img = "";

if ($term_img[3]) {
$cat_img = "<img src='". $term_img[0] ."' width='" . $term_img[1] . "' height='" . $term_img[2] . "' />";
}

$result = $result . '<a href="'.get_term_link($category).'" >'
. $cat_img
. $category->name
. '</a><br/>';
}

}

$result = $result . "</div>";

return $result;
}
add_shortcode('show-product-categories-with-image', 'showProductCat');
Categories
Code Snippets PHP Wordpress

Redirect for a Specific Page on WordPress

Here’s a snippet of code to redirect users who land on a specific page of your wordpress site.

You will need the page id. Add it to your functions.php file.

The code below redirect users to my site. šŸ™‚

function redirect_to_another_page() {
   $page_id_to_redirect = 119; //enter page id here
   $destination = 'https://kimberleydurrant.com'; //enter destination url here

   if ( is_page($page_id_to_redirect) ) {
      wp_redirect( $destination, 301 );
      exit;
   }
}
add_action( 'template_redirect', 'redirect_to_another_page' );
Categories
Blog Code Snippets PHP Wordpress

WordPress – Deactivate a Sidebar or Widgetized Area

Here’s how to deactive a Sidebar or Widgetized Area in WordPress so it won’t show on the website and neither will it show on the Widgets section of the wordpress backend.

First, get the name of the sidebar, you may need to check the theme functions file to get exactly it is.

In this case, we will assume that the sidebar name is ‘sidebar-1’.

Add the code below to your functions file.

function remove_some_widgets(){

	// Unregister sidebar
	unregister_sidebar( 'sidebar-1' );

}
add_action( 'widgets_init', 'remove_some_widgets', 11 );
Categories
Blog Code Snippets PHP Wordpress

WordPress – Embed a Visual Composer page with CSS Styles

Here’s how to embed a page created with Visual Composer onto another page with the page CSS styles included. You can add this code to either the header or footer file of your theme, or another theme file for that matter.

In other words, include a Visual Composer Page as a header, footer or sidebar.

First step: note the id of the page to be embedded. In our example, let’s assume the id of the page to be embedded is 899.

Use this snippet and put the id into the first line of code as indicated below.

$id = 899;	//Assumes the page id to be embedded is 899
$p = get_page($id);


//Loads page styles
$shortcodes_custom_css = get_post_meta( $id, '_wpb_shortcodes_custom_css', true );
if ( ! empty( $shortcodes_custom_css ) ) {
    echo '<style type="text/css" data-type="vc_shortcodes-custom-css-'.$id.'">';
        echo $shortcodes_custom_css;
    echo '</style>';
}

//Loads page content
echo apply_filters('the_content', $p->post_content);