Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Take Control of Your Widgets

Kaspars
January 26, 2013

Take Control of Your Widgets

A talk about building a WordPress plugin that controls sidebar and widget visibility depending on the section/page/post being viewed.

Kaspars

January 26, 2013
Tweet

More Decks by Kaspars

Other Decks in Programming

Transcript

  1. Take Control of
    Your Widgets
    Kaspars Dambis
    konstruktors.com
    @konstruktors
    WordCamp Norway 2013

    View Slide

  2. Who is this guy?

    View Slide

  3. Latvian Champion in Autocross, 2007

    View Slide

  4. World's first electric race car
    to finish Dakar rally in 2012

    View Slide

  5. View Slide

  6. View Slide

  7. In ❤ since 2007

    View Slide

  8. View Slide

  9. Custom Function Widgets

    View Slide

  10. Custom Function Widgets

    View Slide

  11. Widget Context
    Version 0.1

    View Slide

  12. A Sidebar?

    View Slide

  13. Sidebar "Minima" for Blogger

    View Slide

  14. Sidebar "Cubric" in WordPress 1.5 (2005)

    View Slide

  15. Sidebar "Twenty Twelve" in WordPress (2012)

    View Slide

  16. Sidebars are
    for related content

    View Slide

  17. Widgets in Core Widgets were first
    provided by a plugin.
    Available in core since
    WP 2.2 (May 16, 2007).

    View Slide

  18. Widgets in Core Available in core since
    WP 2.2 (May 16, 2007).

    View Slide

  19. Problems
    1. Widgets are not attached to the content
    2. Widgets can't be edited in context
    BUT
    Widgets provide flexibility

    View Slide

  20. But Context Matters

    View Slide

  21. Solutions
    1. Use multiple widget areas (sidebars) and
    templates to control their appearance
    2. Use a plugin

    View Slide

  22. Solutions
    1. Use multiple widget areas (sidebars) and
    templates to control their appearance
    2. Use a plugin

    View Slide

  23. Need to know Template Tags
    (can't give to clients)
    Uses evil() eval();
    Widget Logic

    View Slide

  24. WooSidebars
    Sidebars as a custom post type.
    Sidebars in context.

    View Slide

  25. Creates a lot of widget
    areas with custom
    visibility rules which are
    defined in another
    section of the WordPress
    dashboard.
    WooSidebars

    View Slide

  26. Display Widgets
    Adds context UI to widget settings.

    View Slide

  27. Individual posts and
    pages can be targeted
    only by URL patterns,
    which are hard to
    understand.
    Widget Context
    Adds context UI to widget settings.

    View Slide

  28. Problems
    1. Widgets can't be edited on per-page basis.
    2. Widgets can't be re-ordered
    on per-page basis

    View Slide

  29. Widget Context
    Experiments

    View Slide

  30. Concept A
    Bring Widget UI into Page Edit Screen

    View Slide

  31. Features:
    Per-page settings;
    Re-order widgets.
    Problems:
    Adding and hiding
    new widgets requires
    editing all pages
    Concept A

    View Slide

  32. Concept A Demo

    View Slide

  33. Simple Show/Hide
    option with a list of
    available rules.
    Concept B

    View Slide

  34. Concept B Demo

    View Slide

  35. Concept C

    View Slide

  36. Concept C Demo

    View Slide

  37. Conclusions
    1. Current setup (Sidebar UI) doesn't allow
    granular widget control.
    2. Granular setup (Post Edit UI) is hard to
    manage on large scale sites.

    View Slide

  38. konstruktors.com
    @konstruktors
    github.com/kasparsd

    View Slide