Click here to load reader

WooCommerce Customization Masterclass (WordCamp Dublin 2017)

  • View
    330

  • Download
    1

Embed Size (px)

Text of WooCommerce Customization Masterclass (WordCamp Dublin 2017)

  • #wcdub 2017

    WooCommerce Customisation Masterclass

    @rmelogli1

  • #wcdub @rmelogli

    WC Customisation Masterclass

    1. Child theme vs WooCommerce template override vs WooCommerce core

    2. WooCommerce Hooks (Actions & Filters)3. Snippets vs Plugins4. Demo: add content, remove content, move content @

    Single Product Page2

  • #wcdub 2017

    WooCommerce Hooks: Definition

    @rmelogli3

  • #wcdub @rmelogli

    Hooks: Actions

    WordPress, Themes & Plugins offer do_action($hook_name) functions at specific execution times or in a specific template position

    Use add_action($hook_name) in your child theme to hook (trigger) your code to ADD/REMOVE content

    4

  • #wcdub @rmelogli

    Hooks: Filters

    WordPress, Themes & Plugins also offer apply_filters($hook_name) functions

    Use apply_filter($hook_name) in your child theme to hook (trigger) your code to EDIT content

    5

  • #wcdub @rmelogli

    Hook Example: Actions

    6

  • #wcdub 2017

    WooCommerce Hooks: Where to find Them

    @rmelogli7

  • #wcdub @rmelogli

    WooCommerce Visual Hook Guides

    8

  • #wcdub 2017

    Snippets vs Plugins

    @rmelogli9

  • #wcdub @rmelogli

    SnippetShort PHP function that adds a specific WP functionality.

    To be placed @ child themes functions.php

    PluginSoftware made of several files that adds new features (too

    many?) to your WordPress website 10

  • #wcdub 2017

    Snippet Example

    @rmelogli11

  • #wcdub @rmelogli

    Snippet Example

    e.g. Show # products sold @ single product

    page

    12

  • #wcdub @rmelogli

    Snippet Example

    e.g. Show # products sold @ single product

    page

    13

  • #wcdub @rmelogli

    Snippet Example

    e.g. Show # products sold @ single product

    page

    14

  • #wcdub 2017

    Demo: WooCommerce Customisation Masterclass

    @rmelogli15

  • #wcdub @rmelogli

    Visual Hook Guides > Add Content

    16

  • #wcdub @rmelogli

    Visual Hook Guides > Remove Content

    17

    Default WooCommerce

    add_actions

  • #wcdub @rmelogli

    Visual Hook Guides > Move Content

    18

    Default WooCommerce

    add_actions