Link to home
Start Free TrialLog in
Avatar of amateur6
amateur6Flag for United States of America

asked on

Adding PrettyPicture to a brand-new, bare-bones custom theme

Hi again Experts --

I'm putting together a very, VERY basic theme that I can use to get a head start on very basic WP sites, and I want to improve on the gallery a little by adding PrettyPicture. I'd rather not do it with a plugin, just go ahead and add everything to the theme so I only need to do it once (and not be at the mercy of developers).

As my name here implies, I really ain't an expert, and I always seem to be moving on to new platforms or languages or whatever... And needing to get up to speed.

So, who wants to tell me what goes where? My theme is so basic so far that it doesn't even have a javascript file yet, okay? We're talking about hand-puppet level of explaining that I'm going to need.

But many, many thanks in advance!
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image

We need to see it to help.  Can you post a link to a test page using it?

Cd&
Avatar of amateur6

ASKER

Sure, sorry -- http://sullivanandco.com/bkflow-test/

Like I said, this is strictly for personal use -- not that I would object to feedback, but my main and most immediate concern is getting prettyPicture working with it.

I know to download the pP file, unzip it, upload it to the theme directory, then paste a bunch of php and/or js around -- but I've found differing opinions about even where to upload the pP directory itself!

So, again -- thanks Cd&!
Oh PrettyPicture is some kind of a product?  I'm not familiar with it.  Where can I see the documentation?

Cd&
Annnd that would be because it's actually called prettyPhoto! Oops.

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/

Looks like I should have put this into jquery instead of javascript, too. D'oh!
Avatar of Jason C. Levine
I'd rather not do it with a plugin, just go ahead and add everything to the theme so I only need to do it once (and not be at the mercy of developers).

So much wrong with the above.

I'd rather not do it with a plugin

Why?  This is what plugins are for!  Adding features to WordPress that allow theme and content updates while not worrying about breaking references is what well-coded plugins do.  And it's not like there is a shortage of lightbox-style gallery plugins for WordPress.

so I only need to do it once

You would only need to add the plugin once and just apply updates automatically as they are released. You will be doing this for WordPress core anyway so it's not like you will be gaining any extra productivity.

(and not be at the mercy of developers)

You're at the mercy of developers whether you use a plugin or stick coding in by hand.  Unless you are going to use a child theme, any theme-based modifications will be lost if you update the theme (or switch to a new one).  If you do hand-code the lightbox stuff in there, you will also need to add custom page templates to take full advantage of the options or also code in custom shortcodes.  Of greater concern is that unless you are unusually conscientious about checking the above site for updates, you will not get any upgrades or notices of security patches and you could be exposing yourself to a hack.  At least with a plugin that is actively maintained, the authors will patch their code as hacks are discovered by the WordPress community.
You're at the mercy of developers whether you use a plugin or stick coding in by hand.  Unless you are going to use a child theme, any theme-based modifications will be lost if you update the theme (or switch to a new one).

As much as I appreciate your thoughts, you completely missed the fact that I'm writing a theme just for myself. I started with a child theme (since it's the correct way to start), but even then I wasn't happy.

Let me elaborate a little further: for my needs, most of the lightbox-style galleries have too many bells and whistles. This is what got me writing my own theme in the first place: 1) so that I only include what I need, 2) so that I know what everything does (or at least why it's in there), and 3) so that I actually learn something.
No, I saw that.  My points still stand: you still lose the mods if/when you switch to a new theme so rather than modify the theme files, use or code a plugin so that the relevant stuff happens independent of theme activity. Yes, you can use a sledgehammer to hang a picture, it just may not be the most appropriate tool for the job.

--------------------------

In order to add what you want to add, you need to get familiar with the WordPress commands to register and enqueue scripts and styles:

http://codex.wordpress.org/Function_Reference/wp_register_style
http://codex.wordpress.org/Function_Reference/wp_enqueue_style

http://codex.wordpress.org/Function_Reference/wp_register_script
http://codex.wordpress.org/Function_Reference/wp_enqueue_script

Because WordPress already has JQuery running, you shouldn't need to call it again to get the lightbox working.  Alter your theme's header.php file to enque the relevant styles and if you want to customize the script per the documentation, make it a separate file and use register/enqueue to call it properly.  At that point you should be able to add the rel="prettyPhoto" to links.
SOLUTION
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I do this all the time: grab a JQuery plugin that I like and integrate it into Wordpress.

How I do it:

1. Get the source. Store the JS in my JS folder
2. Add the js files to head using wp_register_script/wp_enqueue_script
3. Create a custom post type called "Slides"
4. Create a template called slider.php
5. Plop in the HTML code from JQuery plugin
6. Install Advanced Custom Fields Plugin and create the custom fields for slider:
Image, caption, call-to action text etc.
7. Put these variables in the appropriate places in the HTML code
8. Cloak the code in a loop
9. include this file in any template using get_template_part()

So, yes, that's what I do. But after reading Jason1178's post, I'm concerned about security issues...
Am I running the risk by integrating jQuery in this way?
Should I create a plugin instead?
But after reading Jason1178's post, I'm concerned about security issues...

My post covers two different things.

1) Security is always going to a be problem if you are integrating code from "somewhere else" unless you can read and understand the code to the point where you can see the flaws.  By relying on some code from completely outside the WordPress ecosystem, the likelihood of seeing a patch from that code goes way down unless you are unusually good at following up with the original code writer to see if patches are available.  Better to find a WordPress plugin that updates frequently in response to flaws discovered in this case, or...

2) Altering the theme to include slider or lightbox functionality is not the best way to go about it (IMHO).  If you have that level of skill, take it one step further and write a plugin so that your functionality is preserved should you ever decide to change themes or, if you were adding this functionality to a theme other than one you created, if the theme updates.  If you are writing your own JQuery lightbox functionality, then absolutely make it a plugin so others can take advantage of the same things I describe above.  If you embed it in the theme and ever decide to distribute the theme you put others in the same boat.

Altering the theme to add code is not inherently insecure nor a bad idea.  If you are doing your own theme with no intention to distribute to the community, then power to you and good luck.  But if you want to contribute to the community and keep WordPress strong, consider the alternatives.
Altering the theme to add code is not inherently insecure nor a bad idea.  If you are doing your own theme with no intention to distribute to the community, then power to you and good luck.  But if you want to contribute to the community and keep WordPress strong, consider the alternatives.
While I (the original poster) appreciate all of your input, "good luck" is hardly an answer. And E-E is a place where I pay to get answers, not lectures on why what I'm doing is wrong (unless it's to say "oh, here's where you broke something; you need to do this instead").

Let me ask my question again...
So, who wants to tell me what goes where? My theme is so basic so far that it doesn't even have a javascript file yet, okay? We're talking about hand-puppet level of explaining that I'm going to need.
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
After days of searching, I managed to find exactly what I was looking for -- step-by-step placement instructions -- outside of EE.