User Tools

Site Tools


ecommerce:toward_a_woocommerce_store

This is an old revision of the document!


Toward a WooCommerce store

This page describes options for setting up a FOSS-ish online store using Wordpress and WooCommerce.

Theme

To get the presentation I wanted with the Storefront theme, I had to make a child theme from it and make some changes. In particular, I wanted to:

  • Change the brand typogrpahy.
  • Use a different shopping cart icon.
  • Remove categories from the navigation.
  • Use a copyright notice that was better suited for purpose.

This meant changing the Storefront child theme style.css and Storefront child theme functions.php files using the Theme Editor.

style.css

style.css
/*
Theme Name: Mithat's Storefront Child
Theme URI: n/a
Description: Storefront modified by mfk.
Author: Automattic/mfk
Author URI: https://mithatkonar.com
Template: storefront
Version: 0.1.0
*/
 
/* make the brand bigger. */
.site-branding .site-title {
  /*font-size: 2.8em;*/
  /*letter-spacing: -0.06em;*/
  font-size: 1.6em; 
  letter-spacing: -0.03em;
  line-height: 0.9em;
}
 
/* change bag icon to cart, from */
/* https://themebynumbers.com/2017/07/04/storefront-change-the-basket-to-a-cart/ */
.site-header-cart .cart-contents:after,
.storefront-handheld-footer-bar ul li.cart > a:before {
  content: "\f07a";
}
 
/* remove homepage categories title. */	
.storefront-product-categories .section-title {display:none;}

functions.php

Hack to get the copyright line to appear as I want.

functions.php
<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;
 
// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:
 
// END ENQUEUE PARENT ACTION
 
/*
 * MFK Storefront customizations
 * Mithat Konar
 */
 
/* Replace copyright info. */
//storefront_credit is a "pluggable" function
function storefront_credit() {
    ?>
        <div class="site-info">
            Copyright &copy 2018-2021 Mithat Konar. All rights reserved.       
        </div>
    <?php
}
 
/* Disable different address checked by default.
 * From https://metorik.com/blog/change-woocommerce-ship-to-a-different-address-default
 * Doesn't work with zones very well.
 */
//add_filter( 'woocommerce_ship_to_different_address_checked', '__return_false' );
 
/* Number of categories on homepage. */
add_filter('storefront_product_categories_shortcode_args','custom_storefront_category_per_page' );
function custom_storefront_category_per_page( $args ) {
 $args['number'] = 2;
 $args['columns'] = 2;
 return $args;
}
 
/* Change titles of homepage sections */
// Featured products
add_filter( 'storefront_featured_products_args', 'custom_storefront_product_featured_title');
function custom_storefront_product_featured_title( $args ) {
    $args['title'] = __( 'Featured products', 'storefront' );
    return $args;  
}
 
// Recent (new) products title
add_filter( 'storefront_recent_products_args', 'custom_storefront_product_recent_products_title');
function custom_storefront_product_recent_products_title( $args ) {
    $args['title'] = __( 'New products', 'storefront' );
    return $args;  
}
 
/* Fonts */
// From http://www.fix-css.com/2016/09/remove-google-fonts-form-woo-storefront-theme/
// Remove Google Font from Storefront theme
/*
function iggy_child_styles() {
    wp_dequeue_style('storefront-fonts');
    add_filter( 'storefront_google_font_families', 'my_font_families' ); // mfk to add desired fonts back in
    wp_enqueue_style('storefront-fonts');                                // mfk to add desired fonts back in
}
add_action( 'wp_enqueue_scripts', 'iggy_child_styles', 900);
*/
 
// If you just need to change Google font from default one, you may use the snippet taken from here.
/*
add_filter( 'storefront_google_font_families', 'my_font_families' );
function my_font_families( $family ) {
    //$family = [];    // mfk to get rid of Source Sans Pro, which isn't gotten rid of anyway though it's not in HTML 
    $family['merienda'] = 'Merienda:400,700';
    return $family;
}
*/
ecommerce/toward_a_woocommerce_store.1634772741.txt.gz · Last modified: 2021/10/20 23:32 by mithat

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki