WordPress Customization for
Higher Educational Institution’s
Websites
DIGITAL-MEDIA DEVELOPMENT
BINUS UNIVERSITY
OCT 2013
...
Fikri Rasyid
@fikrirasyid
http://fikrirasyid.com
frasyid@binus.edu

Deni Tri
facebook.com/2denitri
dhartanto@binus.edu

Word...
Institution

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVE...
Higher Educational Institution

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELO...
Management Process in
Higher educational institution
registrant

student

alumni

INPUT

process

OUTPUT

management
admis...
Registrant

Student

Alumni

INPUT

Process

OUTPUT

Management
Admission

Registration

Study

Exam

ALUMNI & BINUSIan
Ca...
ACADEMIC
PROCESS

+

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
ACADEMIC
PROCESS

+

BINUS University Site
binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websi...
ACADEMIC
PROCESS

+

Departments &
Divisions’ Site
sbm.binus.ac.id
websimprug.binus-school.net
binus.edu
binus.tv
dmd.binu...
ACADEMIC
PROCESS

+

BINUS TRACKING

dmd.binus.ac.id/tracking

WordPress Customization for
Higher Educational Institution’...
ACADEMIC
PROCESS

+

BINUS TICKET

dmd.binus.ac.id/tICKET

WordPress Customization for
Higher Educational Institution’s We...
ACADEMIC
PROCESS

+

ACHIEVEMENTS

Achievement.binus.ac.id

WordPress Customization for
Higher Educational Institution’s W...
ACADEMIC
PROCESS

+

BINUS MICROSITE
socs.binus.ac.id/beefest-mobile-2013/
msi.binus.ac.id/commit/
binus.edu/iea/
binus.ed...
ACADEMIC
PROCESS

+

BINUS CALENDAR
event.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websit...
Today’s FOcus:
Event

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BI...
Today’s FOcus: Event

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BI...
Let’s Talk

&

BINUS MICROSITE

BINUS CALENDAR
WordPress Customization for
Higher Educational Institution’s Websites
DIGIT...
The Concept

&

BINUS MICROSITE

BINUS CALENDAR
WordPress Customization for
Higher Educational Institution’s Websites
DIGI...
BINUS Microsite

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS U...
Rationale
• Continuous need for organizing an event
• Demand for an event website become inevitable
• Every Division / Dep...
THE PLAN

msi.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT...
THE PLAN

msi.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT...
THE PLAN

msi.binus.ac.id

msi.binus.ac.id/commit/

WordPress Customization for
Higher Educational Institution’s Websites
...
The Plan

Display information, registration, schedule & Venue, paper submission, gallery

WordPress Customization for
High...
The Plan

Display information, registration, schedule & Venue, paper submission, gallery

WordPress Customization for
High...
The Plan

Display information, registration, schedule & Venue, paper submission, gallery

WordPress Customization for
High...
The Plan

Display information, registration, schedule & Venue, paper submission, gallery

WordPress Customization for
High...
The Plan

Display information, registration, schedule & Venue, paper submission, gallery

WordPress Customization for
High...
BINUS Calendar

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UN...
Rationale
• Most sub-sites have an “event” section
• According to BINUS’ Marketing Communication Division, there are
at le...
Let’s make a calendar, then

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPME...
THE PLAN
Other site A
binus.ac.id

CENTRAL
event.binus.ac.id

Other site B
scdc.binus.ac.id

Other site C
and many moore

...
THE (REVISED) PLAN
Other site A
binus.ac.id

CENTRAL
event.binus.ac.id

Other site B
scdc.binus.ac.id

Other site C
and ma...
CENTRAL
event.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT...
CENTRAL
event.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT...
The
“CLIENTS”
everywhere

binus.ac.id

BINUS.edu

scdc.binus.ac.id
WordPress Customization for
Higher Educational Institut...
WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY
Friday,...
WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY
Friday,...
WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY
Friday,...
The Tricks

&

BINUS MICROSITE

BINUS CALENDAR
WordPress Customization for
Higher Educational Institution’s Websites
DIGIT...
BINUS Microsite

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS U...
THE PLAN

msi.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT...
THE PLAN

msi.binus.ac.id

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT...
THE PLAN

msi.binus.ac.id

msi.binus.ac.id/commit/

WordPress Customization for
Higher Educational Institution’s Websites
...
Simple Solution
• Provide a new installation of Wordpress multisite for every
department that wanna hold an event
• Create...
Disaster
• it's impossible to handle the rapidly request for event from every
department
• Must maintain dozens of WordPre...
Better Solution
• Create a system that capable of building a microsite inside a
wordpress website, even though it's a subs...
Here’s How it looks

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Here’s How It Looks

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Here’s How It Looks

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Here’s How It Looks

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Here’s How It Works

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Store it

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSI...
Rewrite, Flush, & Redirect

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMEN...
Rewrite, Flush, & Redirect

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMEN...
Microsite Redirect

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINU...
msi.binus.ac.id/commit/

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ●...
THE API
• Rewrite_API
(http://codex.wordpress.org/Rewrite_API/add_rewrite_rule)

• Administration Menu Functions
(http://c...
Lesson Learned
• Microsite hooks & filters are for itself only
• Disable conflicted hooks & filters
i.e.: wp_ enqueue_style /...
Microsite hooks & filters
Are For Itself only
1. Detect the environment
2. Hook into
template_redirect to add
microsite’s ...
Disable conflicted hooks & filters
1. Create a function for
cleaning intended hooks
2. Get list of every hooks/
filters tha...
Convert every on-site link
into microsite pattern link.
1. Get the URL string from
href attribute and the
inner HTML of “a...
Convert every on-site link
into microsite pattern link.
1. Get the URL string from
href attribute and the
inner HTML of “a...
Let’s extend the microsite
Assuming the environment is clean, we can put our creativities
here:
1.Implant any microsite fe...
BINUS Calendar

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BINUS UN...
THE PLAN

event.binus.ac.id

scdc.binus.ac.id/event/

WordPress Customization for
Higher Educational Institution’s Website...
THe Plan
• Create a centralized event site
http://event.binus.ac.id

• Every site should have an event page
http://divisio...
Here’s How It Looks

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Here’s How It Looks

WordPress Customization for
Higher Educational Institution’s Websites
DIGITAL-MEDIA DEVELOPMENT ● BIN...
Lesson Learned
• Quite tricky queries, especially for the monthly view
• WordPress’ default XML-RPC Component can not be u...
Thou Shall Extend
WordPress’ XML-RPC Components
1. Filter xmlrpc_methods
2. Add new XML-RPC
component to it

WordPress Cus...
WordPress Customization for Higher Educational
Institution’s Websites

Friday, October 18, 13

WordPress Customization for...
Upcoming SlideShare
Loading in...5
×

WordPress Customization for Higher Educational Institution’s Websites

3,411

Published on

Materi mengenai kustomisasi WordPress untuk website institusi pendidikan. Dibawakan oleh tim DMD BINUS (Fikri Rasyid & Deni Tri Hartanto) untuk WordCamp Indonesia 2013, Yogyakarta, 18 Oktober 2013.

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,411
On Slideshare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
8
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "WordPress Customization for Higher Educational Institution’s Websites"

  1. 1. WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT BINUS UNIVERSITY OCT 2013 Friday, October 18, 13
  2. 2. Fikri Rasyid @fikrirasyid http://fikrirasyid.com frasyid@binus.edu Deni Tri facebook.com/2denitri dhartanto@binus.edu WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  3. 3. Institution WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  4. 4. Higher Educational Institution WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  5. 5. Management Process in Higher educational institution registrant student alumni INPUT process OUTPUT management admission Registration Study Exam ALUMNI & binusian career SERVICES Community Industry WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  6. 6. Registrant Student Alumni INPUT Process OUTPUT Management Admission Registration Study Exam ALUMNI & BINUSIan Career SERVICES Community Industry WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  7. 7. ACADEMIC PROCESS + WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  8. 8. ACADEMIC PROCESS + BINUS University Site binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  9. 9. ACADEMIC PROCESS + Departments & Divisions’ Site sbm.binus.ac.id websimprug.binus-school.net binus.edu binus.tv dmd.binus.ac.id and 40+ more WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  10. 10. ACADEMIC PROCESS + BINUS TRACKING dmd.binus.ac.id/tracking WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  11. 11. ACADEMIC PROCESS + BINUS TICKET dmd.binus.ac.id/tICKET WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  12. 12. ACADEMIC PROCESS + ACHIEVEMENTS Achievement.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  13. 13. ACADEMIC PROCESS + BINUS MICROSITE socs.binus.ac.id/beefest-mobile-2013/ msi.binus.ac.id/commit/ binus.edu/iea/ binus.edu/porsekary/ english.binus.ac.id/national-englishcompetition/ WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  14. 14. ACADEMIC PROCESS + BINUS CALENDAR event.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  15. 15. Today’s FOcus: Event WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  16. 16. Today’s FOcus: Event WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  17. 17. Let’s Talk & BINUS MICROSITE BINUS CALENDAR WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  18. 18. The Concept & BINUS MICROSITE BINUS CALENDAR WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  19. 19. BINUS Microsite WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  20. 20. Rationale • Continuous need for organizing an event • Demand for an event website become inevitable • Every Division / Department website is already a child site of binus.ac.id • Whereas it takes 1 more depth for the event website WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  21. 21. THE PLAN msi.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  22. 22. THE PLAN msi.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  23. 23. THE PLAN msi.binus.ac.id msi.binus.ac.id/commit/ WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  24. 24. The Plan Display information, registration, schedule & Venue, paper submission, gallery WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  25. 25. The Plan Display information, registration, schedule & Venue, paper submission, gallery WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  26. 26. The Plan Display information, registration, schedule & Venue, paper submission, gallery WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  27. 27. The Plan Display information, registration, schedule & Venue, paper submission, gallery WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  28. 28. The Plan Display information, registration, schedule & Venue, paper submission, gallery WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  29. 29. BINUS Calendar WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  30. 30. Rationale • Most sub-sites have an “event” section • According to BINUS’ Marketing Communication Division, there are at least 9 events reported monthly across BINUS • If we really think about it, an academic institutions must have this “academic plan” WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  31. 31. Let’s make a calendar, then WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  32. 32. THE PLAN Other site A binus.ac.id CENTRAL event.binus.ac.id Other site B scdc.binus.ac.id Other site C and many moore WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  33. 33. THE (REVISED) PLAN Other site A binus.ac.id CENTRAL event.binus.ac.id Other site B scdc.binus.ac.id Other site C and many moore WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  34. 34. CENTRAL event.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  35. 35. CENTRAL event.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  36. 36. The “CLIENTS” everywhere binus.ac.id BINUS.edu scdc.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  37. 37. WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  38. 38. WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  39. 39. WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  40. 40. The Tricks & BINUS MICROSITE BINUS CALENDAR WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  41. 41. BINUS Microsite WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  42. 42. THE PLAN msi.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  43. 43. THE PLAN msi.binus.ac.id WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  44. 44. THE PLAN msi.binus.ac.id msi.binus.ac.id/commit/ WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  45. 45. Simple Solution • Provide a new installation of Wordpress multisite for every department that wanna hold an event • Create a subsite and theme for each and every event WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  46. 46. Disaster • it's impossible to handle the rapidly request for event from every department • Must maintain dozens of WordPress installation WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  47. 47. Better Solution • Create a system that capable of building a microsite inside a wordpress website, even though it's a subsite WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  48. 48. Here’s How it looks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  49. 49. Here’s How It Looks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  50. 50. Here’s How It Looks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  51. 51. Here’s How It Looks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  52. 52. Here’s How It Works WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  53. 53. Store it WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  54. 54. Rewrite, Flush, & Redirect WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  55. 55. Rewrite, Flush, & Redirect WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  56. 56. Microsite Redirect WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  57. 57. msi.binus.ac.id/commit/ WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  58. 58. THE API • Rewrite_API (http://codex.wordpress.org/Rewrite_API/add_rewrite_rule) • Administration Menu Functions (http://codex.wordpress.org/Administration_Menus) • Options API http://codex.wordpress.org/Options_API WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  59. 59. Lesson Learned • Microsite hooks & filters are for itself only • Disable conflicted hooks & filters i.e.: wp_ enqueue_style / wp_enqueue_script • Convert every link of wordpress object in navigation menu / post into microsite pattern link. www.abc.com/2012/12/{page-slug} is converted into www.abc.com/{microsite_name}/article/{pageslug} WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  60. 60. Microsite hooks & filters Are For Itself only 1. Detect the environment 2. Hook into template_redirect to add microsite’s functions WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  61. 61. Disable conflicted hooks & filters 1. Create a function for cleaning intended hooks 2. Get list of every hooks/ filters that we want to disable, (the list is set by administrator) 3. Loop the listed hooks and call remove_filter for every hooks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  62. 62. Convert every on-site link into microsite pattern link. 1. Get the URL string from href attribute and the inner HTML of “a” element on the post body / navigation menu 2. pass the string on to function “microsite_article_convert er” that responsible to convert it into our microsite pattern WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  63. 63. Convert every on-site link into microsite pattern link. 1. Get the URL string from href attribute and the inner HTML of “a” element on the post body / navigation menu 2. pass the string on to function “microsite_article_convert er” that responsible to convert it into our microsite pattern WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  64. 64. Let’s extend the microsite Assuming the environment is clean, we can put our creativities here: 1.Implant any microsite feature as much as you wish 2.Add new redirection filter 3.Put every hook / filter based on your needs WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  65. 65. BINUS Calendar WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  66. 66. THE PLAN event.binus.ac.id scdc.binus.ac.id/event/ WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  67. 67. THe Plan • Create a centralized event site http://event.binus.ac.id • Every site should have an event page http://division_name.binus.ac.id/event/ WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  68. 68. Here’s How It Looks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  69. 69. Here’s How It Looks WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  70. 70. Lesson Learned • Quite tricky queries, especially for the monthly view • WordPress’ default XML-RPC Component can not be used for our queries • Extend the XML-RPC Components so the sub-site can fetch and display similar result, only filtered to their own program taxonomy WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  71. 71. Thou Shall Extend WordPress’ XML-RPC Components 1. Filter xmlrpc_methods 2. Add new XML-RPC component to it WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY Friday, October 18, 13
  72. 72. WordPress Customization for Higher Educational Institution’s Websites Friday, October 18, 13 WordPress Customization for Higher Educational Institution’s Websites DIGITAL-MEDIA DEVELOPMENT ● BINUS UNIVERSITY
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×