Parallax Scroll by adamrob.co.uk

Description

Parallax Scroll; the easiest way to get a parallax scrolling background image for an element on your page/posts.

Examples include:

• Create a header text with a parallax scrolling background.
• Create a full section containing any content with a parallax scrolling background.
• Give single elements of your pages a parallax scrolling background.
• Ideal for sites with sections.

How?

• Simply create the content required in the custom Parallax Scroll post type.
• The Parallax Scroll admin page will display the shortcode required for all Parallax Scroll post types defined. Copy this shortcode, and paste it into any page or post.
• Alternatively you can use the plugin directly in your php code. Implement it straight into your theme!
• Thats it!

Screenshots

Installation

No special steps required for installation.

Auto Install:

1. Navigate to plugins page in your WordPress admin section.
2. Search for Parallax Scroll by adamrob.co.uk.
3. Download and activate.
4. You will now have the Parallax Scroll menu item in your WordPress admin

Manual Install:

1. Download the plugin files.
2. Copy/upload the plugin folder to your WordPress Content/plugins directory.
3. Navigate to WordPress plugin page in your WordPress admin page. The plugin will be displayed.
4. Click activate. You will now have the Parallax Scroll menu item in your WordPress admin.

FAQ

How can I use Parallax Scroll in my theme and/or PHP?

You can now use parallax scroll in your themes, using PHP. Using this method, there is no need to add a shortcode to a page or post; just simply paste the following PHP code into your PHP page where you would like your parallax to display. This method is especially usefull if you are having trouble with full width, or you would like to build it into your theme.

echo do_shortcode('[parallax-scroll id="#"]')

Where # = parallax ID number

I have no background image?

Make sure you set a featured image in the Parallax setup screen. This is usualy in the bottom right of the edit page. This image will be the background.

Full width does not work

Parallax scroll has been written to work across as many different themes as possible, however as everyones wordpress setup is different, and every theme is different it is very difficult if not near impossible to guarente that the plugin will work on every site. Parallax scroll is built and tested using the standard wordpress themes; this is the only base line that is availble to work against; therfore if you are having issues, please test it against the standard theme to check if its a fault with the plugin or the theme.

The full width issue is a common one, where the parallax does not span the full width of the page. Parallax scroll is designed to be full width out of the box. As standard it will size to the full width of the post. If this doesn’t work as required, a full width option is availble. This is a bit of a hack to resize the parallax to the full width of the content area of the page/post. Because this is a bit of a hack, it may not appear correctly for everyone.

Why is this an issue on some themes? Well some themes, even though they claim are full width themes, are not actually full width at all. A lot of themes will actually be setup using divs with margins either side. They trick you into thinking its full width by setting the colors and borders to the same color. Unfortunatly, on themes like this its impossible for me to cater for, however you can modify the fullwidth.js script to target the specific width required yourself.

Where can i get support?

Please visit the support forums to check if the subject is already covered.
Alternatively visit adamrob.co.uk for support and/or suggestions.

Reviews

Fantastic!

WebDragon December 29, 2017

Love this. Made parallax sections work, and in the simplest manner possible. I’ve seen a few other attempts at parallaxing on wordpress and every one of them was messy in implementation. Only thing missing, IMHO, is the ability to identify sections via name/title and not just ID i.e., [parallax-scroll name=”special event carousel”] or [parallax-scroll title=”featured”] instead of [parallax-scroll id=”419″] as it makes identifying which is which much easier when looking at several of them on the target page editor.

Doesn’t work on mobile.

Zen777 September 13, 2017

Why do no parallax plugins support mobile? I had to create the CSS myself so it is possible.

Breaks wp-admin when I try to Add New Parallax

therudnick April 4, 2017

Whenever I try to “Add New” on the Parallax Scroll page, some error occurs and I have to go back to the main dashboard.

Does What It Says

thorshammer December 13, 2016 1 reply

This plugin is simple to implement, and provides the right balance of control and ease of use. Thank you!

Broken CSS

JanPB December 7, 2016

The CSS Code ist totally broken – Theme: circles

*tears of joy*

The Barefoot Bookworm September 3, 2016

Finally a parallax solution that doesn’t make me cry! Well, not in a bad way. I’ve used parallax plugins, built-in parallax options with numerous premium themes, and in a pinch I’ve also built parallax sections using CSS. This is the only time I’ve had fun.

Contributors & Developers

Changelog

0.1

• Initial release.

0.2

• Added header CSS style parameter to custom post type.

0.3

• Fixed – Fixed an issue where some themes would not render the parallax background image (such as the default themes).
• Added – Screenshots on WordPress plugins directory.

0.4

• Added – Two new options to add the ability of disabling parallax scroll image or content when on mobile device.
• Added – Full width option. This option will over-ride the themes content area style and make the parallax full width.
• Fixed – Shortcodes in the parallax scroll post content now work correctly.

1.0

• Updated – Parallax.js has now been removed. The parallax is now driven from CSS. This will improve browser compatability, in particular with internet explorer.

1.1

• Fixed – Fixed full width issue where if more than one parallax was used in a single post/page they would not size correctly

1.2

• Added – New help menu’s
• Added – Parallax image size option

1.3

• Fixed – Menu Position Bug

1.4

• Fixed – Images should appear better on mobile devices
• Added – Image size option just for mobile devices
• Added – Additional Div IDs

2.0

• Added – Background parallax image can now scroll at a different speed to the page.
• Added – New background scroll setpoint to admin page
• Added – Input sanitisation for number inputs
• Updated – Split admin setup parameters into sections, and added section descriptions
• Added – Added an option to use parallax.js as the parallax engine rather than CSS. (See https://pixelcog.github.io/parallax.js/ for information on parallax.js)
• Added – Added ability to target the CSS class of the Post content/title. Also added the ability to target specific parallax styles through the ID
• Updated – Updated the help files to be more in depth for customising and setting up. Also added more obvious message on admin page.
• Updated – Bug fixes.

2.0.1

• Tested with latest version of WordPress.

2.1

• Fixed – Removed the ability to add HTML markup to the title field. The title field is now escaped when rendering at the front end regardless of user permissions. – Issue 01 from bitbucket repo
• Tested with latest version of wordpress, using the latest wordpress theme on all major browsers.

3.0.0

• Plugin has had a complete re-write in the backend; although this version doesn’t bring many new features, it provides the ground work to provide some major planned upgrades to both the CSS and java script parallaxs.
• Posts meta options have been split out into tabs for better navigation.

3.0.1

• Fixed – Mobile image size bug.
• Fixed – Incorrect div markup for full width mode.