SlideShare a Scribd company logo
Using JavaScript Libraries
like D3.js withWordPress
Presented By: John Cook
@johntylercook
WPtraining.tv
• Created by Brendan Eich in May 1995
• DynamicallyTyped
• Types are associated with values, not with variables
• Object Based
• Supports Dot Notation: object.y = 5
• Supports Bracket Notation: object['y'] = 5
• RunTime Evaluation
• Properties and values can be added, changed, or deleted at run-time.
JavaScript
Plugins Themes Content
Pros
• Can add to both site and
admin
• Works with most themes
• Can include in content with
shortcodes
• Extreme control
over where within
the theme the
library should be
used.
• Placed where you want
within post and page
content
• Easy to add/edit
• Works with most themes
Cons
• Requires programming
experience
• Requires
programming
experience
• More difficult to
include within page
content
• JavaScript libraries might
be included twice or not in
the proper way.
JavaScript and WordPress
•Use wp_enqueue_script() to add Scripts
•Use the Shortcode API to add shortcodes that can then
be used within post and page content.
JavaScript and WordPress Plugins
<?php
//To load a script that isn't already registered with WordPress
wp_enqueue_script( $handle, $source, $deps, $ver, $in_footer );
// Loading an example script
wp_enqueue_script('myscript', plugins_url( '/js/myscript.js', dirname(__FILE__) ) );
// Loading a pre-registered script
wp_enqueue_script('jquery');
?>
•Use wp_enqueue_script() to add script libraries
•Can create and add JavaScript code to a page
template.
•Can add JavaScript code to header.php or footer.php
and use:
• is_page_template()
• is_page()
JavaScript and WordPressThemes
1. Install a plugin for showing JavaScript/charts
and use the built in shortcodes.
2. Install a plugin for including scripts in the header
of the page and then go intoText mode to add
the chart code
JavaScript and Post Content
JavaScripting.com
•D3.js
•jQuery
•Three.js
JavaScript Libraries
JSPerf.com
https://wordpress.org/plugins/ipu-chart/
•Supports D3.js and SVG Charting
•Install the plugin and use the shortcode to add
charts to post and page content.
IPU-Chart
Questions?
Presented By: John Cook
@johntylercook
WPtraining.tv

More Related Content

What's hot (20)

Newspapers with WordPress
Newspapers with WordPressNewspapers with WordPress
Newspapers with WordPress
Christopher Ross
 
Upgrading to Drupal 8: Benefits and Gotchas
Upgrading to Drupal 8: Benefits and GotchasUpgrading to Drupal 8: Benefits and Gotchas
Upgrading to Drupal 8: Benefits and Gotchas
Suzanne Dergacheva
 
[Webinar] Discover eZ platform v2.4
[Webinar]  Discover eZ platform v2.4[Webinar]  Discover eZ platform v2.4
[Webinar] Discover eZ platform v2.4
eZ Systems
 
TypeScript and Angular2 (Love at first sight)
TypeScript and Angular2 (Love at first sight)TypeScript and Angular2 (Love at first sight)
TypeScript and Angular2 (Love at first sight)
Igor Talevski
 
ITT Flisol 2013
ITT Flisol 2013ITT Flisol 2013
ITT Flisol 2013
Domingo Suarez Torres
 
Get Involved with WordPress
Get Involved with WordPressGet Involved with WordPress
Get Involved with WordPress
Mario Peshev
 
WordPress Theme Reviewers Team
WordPress Theme Reviewers TeamWordPress Theme Reviewers Team
WordPress Theme Reviewers Team
Mario Peshev
 
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Viktor Vogel
 
Kickstart android development with xamarin
Kickstart android development with xamarinKickstart android development with xamarin
Kickstart android development with xamarin
Foyzul Karim
 
Porting ASP.NET applications to Windows Azure
Porting ASP.NET applications to Windows AzurePorting ASP.NET applications to Windows Azure
Porting ASP.NET applications to Windows Azure
Gunnar Peipman
 
Getting Started with WordPress Plugin Development
Getting Started with WordPress Plugin DevelopmentGetting Started with WordPress Plugin Development
Getting Started with WordPress Plugin Development
Abhishek Deshpande
 
Developing Complex WordPress Sites without Fear of Failure (with MVC)
Developing Complex WordPress Sites without Fear of Failure (with MVC)Developing Complex WordPress Sites without Fear of Failure (with MVC)
Developing Complex WordPress Sites without Fear of Failure (with MVC)
Mike Schinkel
 
WordPress as a Service
WordPress as a ServiceWordPress as a Service
WordPress as a Service
Andrew Bauer
 
Maximizing WordPress
Maximizing WordPressMaximizing WordPress
Maximizing WordPress
Brian LaFrance
 
Interoperability of components built with different frameworks
Interoperability of components built with different frameworksInteroperability of components built with different frameworks
Interoperability of components built with different frameworks
Souvik Basu
 
Asp.Net 3 5 Part 1
Asp.Net 3 5 Part 1Asp.Net 3 5 Part 1
Asp.Net 3 5 Part 1
asim78
 
Creating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVCCreating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVC
Lohith Goudagere Nagaraj
 
Better WordPress Theme Development Workflow
Better WordPress Theme Development WorkflowBetter WordPress Theme Development Workflow
Better WordPress Theme Development Workflow
Rajeeb Banstola
 
WordPress as a Headless CMS - Bronson Quick
WordPress as a Headless CMS - Bronson QuickWordPress as a Headless CMS - Bronson Quick
WordPress as a Headless CMS - Bronson Quick
WordCamp Sydney
 
WebNetConf 2012 - Single Page Apps
WebNetConf 2012 - Single Page AppsWebNetConf 2012 - Single Page Apps
WebNetConf 2012 - Single Page Apps
Pop Apps
 
Upgrading to Drupal 8: Benefits and Gotchas
Upgrading to Drupal 8: Benefits and GotchasUpgrading to Drupal 8: Benefits and Gotchas
Upgrading to Drupal 8: Benefits and Gotchas
Suzanne Dergacheva
 
[Webinar] Discover eZ platform v2.4
[Webinar]  Discover eZ platform v2.4[Webinar]  Discover eZ platform v2.4
[Webinar] Discover eZ platform v2.4
eZ Systems
 
TypeScript and Angular2 (Love at first sight)
TypeScript and Angular2 (Love at first sight)TypeScript and Angular2 (Love at first sight)
TypeScript and Angular2 (Love at first sight)
Igor Talevski
 
Get Involved with WordPress
Get Involved with WordPressGet Involved with WordPress
Get Involved with WordPress
Mario Peshev
 
WordPress Theme Reviewers Team
WordPress Theme Reviewers TeamWordPress Theme Reviewers Team
WordPress Theme Reviewers Team
Mario Peshev
 
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Viktor Vogel
 
Kickstart android development with xamarin
Kickstart android development with xamarinKickstart android development with xamarin
Kickstart android development with xamarin
Foyzul Karim
 
Porting ASP.NET applications to Windows Azure
Porting ASP.NET applications to Windows AzurePorting ASP.NET applications to Windows Azure
Porting ASP.NET applications to Windows Azure
Gunnar Peipman
 
Getting Started with WordPress Plugin Development
Getting Started with WordPress Plugin DevelopmentGetting Started with WordPress Plugin Development
Getting Started with WordPress Plugin Development
Abhishek Deshpande
 
Developing Complex WordPress Sites without Fear of Failure (with MVC)
Developing Complex WordPress Sites without Fear of Failure (with MVC)Developing Complex WordPress Sites without Fear of Failure (with MVC)
Developing Complex WordPress Sites without Fear of Failure (with MVC)
Mike Schinkel
 
WordPress as a Service
WordPress as a ServiceWordPress as a Service
WordPress as a Service
Andrew Bauer
 
Interoperability of components built with different frameworks
Interoperability of components built with different frameworksInteroperability of components built with different frameworks
Interoperability of components built with different frameworks
Souvik Basu
 
Asp.Net 3 5 Part 1
Asp.Net 3 5 Part 1Asp.Net 3 5 Part 1
Asp.Net 3 5 Part 1
asim78
 
Creating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVCCreating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVC
Lohith Goudagere Nagaraj
 
Better WordPress Theme Development Workflow
Better WordPress Theme Development WorkflowBetter WordPress Theme Development Workflow
Better WordPress Theme Development Workflow
Rajeeb Banstola
 
WordPress as a Headless CMS - Bronson Quick
WordPress as a Headless CMS - Bronson QuickWordPress as a Headless CMS - Bronson Quick
WordPress as a Headless CMS - Bronson Quick
WordCamp Sydney
 
WebNetConf 2012 - Single Page Apps
WebNetConf 2012 - Single Page AppsWebNetConf 2012 - Single Page Apps
WebNetConf 2012 - Single Page Apps
Pop Apps
 

Viewers also liked (13)

RotationProposal_ShorrockM_D1
RotationProposal_ShorrockM_D1RotationProposal_ShorrockM_D1
RotationProposal_ShorrockM_D1
Meghann Shorrock
 
Чем отличаются сиреневый, фиолетовый и пурпурный?
Чем отличаются сиреневый, фиолетовый и пурпурный?Чем отличаются сиреневый, фиолетовый и пурпурный?
Чем отличаются сиреневый, фиолетовый и пурпурный?
Жанна Подколзина
 
Financial Structure Assignment
Financial Structure AssignmentFinancial Structure Assignment
Financial Structure Assignment
Niles Clark
 
resume word
resume wordresume word
resume word
Michelyn Clark
 
Reese - Giles Resume
Reese - Giles ResumeReese - Giles Resume
Reese - Giles Resume
Alyx (Lexi) Reese
 
BabyCenterIndia Introduction
BabyCenterIndia IntroductionBabyCenterIndia Introduction
BabyCenterIndia Introduction
Srikrishna Ranade, PMP
 
Proyecto de-vida.
Proyecto de-vida.Proyecto de-vida.
Proyecto de-vida.
jean guaman
 
ib-pulse-check-executive-summary
ib-pulse-check-executive-summaryib-pulse-check-executive-summary
ib-pulse-check-executive-summary
Eoghan Trehy
 
Bewust E-mailen: presentatie voor JONG! Valkenswaard
Bewust E-mailen: presentatie voor JONG! ValkenswaardBewust E-mailen: presentatie voor JONG! Valkenswaard
Bewust E-mailen: presentatie voor JONG! Valkenswaard
Bas Kierkels
 
Vip Services e-Booklet-c2p
Vip Services e-Booklet-c2pVip Services e-Booklet-c2p
Vip Services e-Booklet-c2p
Elias A. Spyrou
 
A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...
A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...
A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...
Nico Huysamen
 
Salve annual PR report 2015 for NowWeMove and ISCA
Salve annual PR report 2015 for NowWeMove and ISCASalve annual PR report 2015 for NowWeMove and ISCA
Salve annual PR report 2015 for NowWeMove and ISCA
Aneta Rouskovska
 
ACB Company Profile
ACB Company ProfileACB Company Profile
ACB Company Profile
American Breeze
 
RotationProposal_ShorrockM_D1
RotationProposal_ShorrockM_D1RotationProposal_ShorrockM_D1
RotationProposal_ShorrockM_D1
Meghann Shorrock
 
Чем отличаются сиреневый, фиолетовый и пурпурный?
Чем отличаются сиреневый, фиолетовый и пурпурный?Чем отличаются сиреневый, фиолетовый и пурпурный?
Чем отличаются сиреневый, фиолетовый и пурпурный?
Жанна Подколзина
 
Financial Structure Assignment
Financial Structure AssignmentFinancial Structure Assignment
Financial Structure Assignment
Niles Clark
 
Proyecto de-vida.
Proyecto de-vida.Proyecto de-vida.
Proyecto de-vida.
jean guaman
 
ib-pulse-check-executive-summary
ib-pulse-check-executive-summaryib-pulse-check-executive-summary
ib-pulse-check-executive-summary
Eoghan Trehy
 
Bewust E-mailen: presentatie voor JONG! Valkenswaard
Bewust E-mailen: presentatie voor JONG! ValkenswaardBewust E-mailen: presentatie voor JONG! Valkenswaard
Bewust E-mailen: presentatie voor JONG! Valkenswaard
Bas Kierkels
 
Vip Services e-Booklet-c2p
Vip Services e-Booklet-c2pVip Services e-Booklet-c2p
Vip Services e-Booklet-c2p
Elias A. Spyrou
 
A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...
A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...
A Scalable Network Monitoring and Bandwidth Throttling System for Cloud Compu...
Nico Huysamen
 
Salve annual PR report 2015 for NowWeMove and ISCA
Salve annual PR report 2015 for NowWeMove and ISCASalve annual PR report 2015 for NowWeMove and ISCA
Salve annual PR report 2015 for NowWeMove and ISCA
Aneta Rouskovska
 
Ad

Similar to Using JavaScript Libraries like D3.js with WordPress (10)

WCLV13 JavaScript
WCLV13 JavaScriptWCLV13 JavaScript
WCLV13 JavaScript
Jeffrey Zinn
 
jQuery Objects
jQuery ObjectsjQuery Objects
jQuery Objects
Steve Wells
 
Object Oriented Programming In JavaScript
Object Oriented Programming In JavaScriptObject Oriented Programming In JavaScript
Object Oriented Programming In JavaScript
Forziatech
 
Java Script - A New Look
Java Script - A New LookJava Script - A New Look
Java Script - A New Look
rumsan
 
OOP and JavaScript
OOP and JavaScriptOOP and JavaScript
OOP and JavaScript
easelsolutions
 
jQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPagesjQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPages
Teamstudio
 
WEB MODULE 3.pdf
WEB MODULE 3.pdfWEB MODULE 3.pdf
WEB MODULE 3.pdf
Deepika A B
 
Jquery
JqueryJquery
Jquery
Momentum Design Lab
 
jQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPagesjQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPages
Mark Roden
 
Make Your Own Charting Library with d3
Make Your Own Charting Library with d3Make Your Own Charting Library with d3
Make Your Own Charting Library with d3
yieldbot
 
Object Oriented Programming In JavaScript
Object Oriented Programming In JavaScriptObject Oriented Programming In JavaScript
Object Oriented Programming In JavaScript
Forziatech
 
Java Script - A New Look
Java Script - A New LookJava Script - A New Look
Java Script - A New Look
rumsan
 
jQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPagesjQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPages
Teamstudio
 
WEB MODULE 3.pdf
WEB MODULE 3.pdfWEB MODULE 3.pdf
WEB MODULE 3.pdf
Deepika A B
 
jQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPagesjQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPages
Mark Roden
 
Make Your Own Charting Library with d3
Make Your Own Charting Library with d3Make Your Own Charting Library with d3
Make Your Own Charting Library with d3
yieldbot
 
Ad

Recently uploaded (20)

vertical-cnc-processing-centers-drillteq-v-200-en.pdf
vertical-cnc-processing-centers-drillteq-v-200-en.pdfvertical-cnc-processing-centers-drillteq-v-200-en.pdf
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
AmirStern2
 
Data Validation and System Interoperability
Data Validation and System InteroperabilityData Validation and System Interoperability
Data Validation and System Interoperability
Safe Software
 
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdfcnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
AmirStern2
 
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptxFIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Alliance
 
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdfENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
Muhammad Rizwan Akram
 
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data ResilienceFloods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Safe Software
 
FIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptx
FIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptxFIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptx
FIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptx
FIDO Alliance
 
Viral>Wondershare Filmora 14.5.18.12900 Crack Free Download
Viral>Wondershare Filmora 14.5.18.12900 Crack Free DownloadViral>Wondershare Filmora 14.5.18.12900 Crack Free Download
Viral>Wondershare Filmora 14.5.18.12900 Crack Free Download
Puppy jhon
 
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
Edge AI and Vision Alliance
 
Analysis of the changes in the attitude of the news comments caused by knowin...
Analysis of the changes in the attitude of the news comments caused by knowin...Analysis of the changes in the attitude of the news comments caused by knowin...
Analysis of the changes in the attitude of the news comments caused by knowin...
Matsushita Laboratory
 
Bridging the divide: A conversation on tariffs today in the book industry - T...
Bridging the divide: A conversation on tariffs today in the book industry - T...Bridging the divide: A conversation on tariffs today in the book industry - T...
Bridging the divide: A conversation on tariffs today in the book industry - T...
BookNet Canada
 
MuleSoft for AgentForce : Topic Center and API Catalog
MuleSoft for AgentForce : Topic Center and API CatalogMuleSoft for AgentForce : Topic Center and API Catalog
MuleSoft for AgentForce : Topic Center and API Catalog
shyamraj55
 
High Availability On-Premises FME Flow.pdf
High Availability On-Premises FME Flow.pdfHigh Availability On-Premises FME Flow.pdf
High Availability On-Premises FME Flow.pdf
Safe Software
 
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptxFIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Alliance
 
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptxFIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Alliance
 
The State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry ReportThe State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry Report
Liveplex
 
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Shashikant Jagtap
 
Oracle Cloud Infrastructure Generative AI Professional
Oracle Cloud Infrastructure Generative AI ProfessionalOracle Cloud Infrastructure Generative AI Professional
Oracle Cloud Infrastructure Generative AI Professional
VICTOR MAESTRE RAMIREZ
 
Your startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean accountYour startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean account
angelo60207
 
Oracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI FoundationsOracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI Foundations
VICTOR MAESTRE RAMIREZ
 
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
vertical-cnc-processing-centers-drillteq-v-200-en.pdfvertical-cnc-processing-centers-drillteq-v-200-en.pdf
vertical-cnc-processing-centers-drillteq-v-200-en.pdf
AmirStern2
 
Data Validation and System Interoperability
Data Validation and System InteroperabilityData Validation and System Interoperability
Data Validation and System Interoperability
Safe Software
 
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdfcnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
AmirStern2
 
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptxFIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Seminar: New Data: Passkey Adoption in the Workforce.pptx
FIDO Alliance
 
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdfENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
Muhammad Rizwan Akram
 
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data ResilienceFloods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Safe Software
 
FIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptx
FIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptxFIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptx
FIDO Seminar: Evolving Landscape of Post-Quantum Cryptography.pptx
FIDO Alliance
 
Viral>Wondershare Filmora 14.5.18.12900 Crack Free Download
Viral>Wondershare Filmora 14.5.18.12900 Crack Free DownloadViral>Wondershare Filmora 14.5.18.12900 Crack Free Download
Viral>Wondershare Filmora 14.5.18.12900 Crack Free Download
Puppy jhon
 
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
“Why It’s Critical to Have an Integrated Development Methodology for Edge AI,...
Edge AI and Vision Alliance
 
Analysis of the changes in the attitude of the news comments caused by knowin...
Analysis of the changes in the attitude of the news comments caused by knowin...Analysis of the changes in the attitude of the news comments caused by knowin...
Analysis of the changes in the attitude of the news comments caused by knowin...
Matsushita Laboratory
 
Bridging the divide: A conversation on tariffs today in the book industry - T...
Bridging the divide: A conversation on tariffs today in the book industry - T...Bridging the divide: A conversation on tariffs today in the book industry - T...
Bridging the divide: A conversation on tariffs today in the book industry - T...
BookNet Canada
 
MuleSoft for AgentForce : Topic Center and API Catalog
MuleSoft for AgentForce : Topic Center and API CatalogMuleSoft for AgentForce : Topic Center and API Catalog
MuleSoft for AgentForce : Topic Center and API Catalog
shyamraj55
 
High Availability On-Premises FME Flow.pdf
High Availability On-Premises FME Flow.pdfHigh Availability On-Premises FME Flow.pdf
High Availability On-Premises FME Flow.pdf
Safe Software
 
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptxFIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Alliance
 
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptxFIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Seminar: Authentication for a Billion Consumers - Amazon.pptx
FIDO Alliance
 
The State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry ReportThe State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry Report
Liveplex
 
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Shashikant Jagtap
 
Oracle Cloud Infrastructure Generative AI Professional
Oracle Cloud Infrastructure Generative AI ProfessionalOracle Cloud Infrastructure Generative AI Professional
Oracle Cloud Infrastructure Generative AI Professional
VICTOR MAESTRE RAMIREZ
 
Your startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean accountYour startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean account
angelo60207
 
Oracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI FoundationsOracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI Foundations
VICTOR MAESTRE RAMIREZ
 

Using JavaScript Libraries like D3.js with WordPress

  • 1. Using JavaScript Libraries like D3.js withWordPress Presented By: John Cook @johntylercook WPtraining.tv
  • 2. • Created by Brendan Eich in May 1995 • DynamicallyTyped • Types are associated with values, not with variables • Object Based • Supports Dot Notation: object.y = 5 • Supports Bracket Notation: object['y'] = 5 • RunTime Evaluation • Properties and values can be added, changed, or deleted at run-time. JavaScript
  • 3. Plugins Themes Content Pros • Can add to both site and admin • Works with most themes • Can include in content with shortcodes • Extreme control over where within the theme the library should be used. • Placed where you want within post and page content • Easy to add/edit • Works with most themes Cons • Requires programming experience • Requires programming experience • More difficult to include within page content • JavaScript libraries might be included twice or not in the proper way. JavaScript and WordPress
  • 4. •Use wp_enqueue_script() to add Scripts •Use the Shortcode API to add shortcodes that can then be used within post and page content. JavaScript and WordPress Plugins <?php //To load a script that isn't already registered with WordPress wp_enqueue_script( $handle, $source, $deps, $ver, $in_footer ); // Loading an example script wp_enqueue_script('myscript', plugins_url( '/js/myscript.js', dirname(__FILE__) ) ); // Loading a pre-registered script wp_enqueue_script('jquery'); ?>
  • 5. •Use wp_enqueue_script() to add script libraries •Can create and add JavaScript code to a page template. •Can add JavaScript code to header.php or footer.php and use: • is_page_template() • is_page() JavaScript and WordPressThemes
  • 6. 1. Install a plugin for showing JavaScript/charts and use the built in shortcodes. 2. Install a plugin for including scripts in the header of the page and then go intoText mode to add the chart code JavaScript and Post Content
  • 9. https://wordpress.org/plugins/ipu-chart/ •Supports D3.js and SVG Charting •Install the plugin and use the shortcode to add charts to post and page content. IPU-Chart
  • 10. Questions? Presented By: John Cook @johntylercook WPtraining.tv