Problems customizing SnapshopWP pages

StatusIDPriorityType
Closed17267HighSnapshop WP
Profile Reply
Travis Client

Hi, I’m a web developer that has been handed a design and asked to work with your template. I haven’t done a ton of WordPress customizations in the past, but I usually know enough that I can figure things out. Unfortunately I’m trying to recreate a few things that you have on your demo site but I can’t see where or how I would create those elements. I looked through the documentation but there was nothing that referenced any of the specific customizations I’m trying to do.

PROMO – PARALLAX PAGE
1) Trying to create a Services main page that mimics the parallax effect that you have here:
http://www.shindiristudio.com/snapshop/promo-parallax/

If you go to the following development site you can view what I’ve done so far:
http://intotheblue.queuepower.ca/

You can visually see what our designer wants the page to look like by going here:
http://intotheblue.queuepower.ca/wp-content/themes/snapshopWP_child/images/services_page_example.jpg

PARALLAX FADE EFFECT ON PRODUCTS SHIRT PAGE
2) The Designer wants to create a similar parallax fade effect to what you have on this page at the top:
http://www.shindiristudio.com/snapshop/promo-shirts/

But once again I can’t see where I would create a similar effect, I’ve tried several things in the revolution slider but none of those have worked.

ADDING REVOLUTION SLIDERS TO THE TOP OF PRODUCT PAGES
3) The designer would like to add revolution sliders to the top of the product pages just like the other pages allow. However, even though the Revolution Slider option appears in the admin of the product pages, the drop down does not have any choices it just shows “default” even though I have several sliders built.

ADDING PLUS/MINUS BUTTONS TO THE QUANTITY BAR
4) Your demo site has the plus and minus buttons on the product pages next to the quantity, yet by default they do not appear on the product pages and I don’t see where I can turn them on or off? I can’t even find where they are being added in the code. You can see the one default product page I have created here:
http://intotheblue.queuepower.ca/shop/fish/blueface-angelfish/

ADDING SOCIAL NETWORK ICONS TO THE HEADER BAR
5) I’ve tried adding social network icons to the far right side of the header bar by editing the header.php page and adding some custom html to the page. If you look at the example image link I provided above you can see what I’m trying to do at the top right of the image.

I’ve added the modified  header.php file to my child theme, but the icons do not show up. I tried pasting the code in here but it messed it up, you can find the modified file here: http://intotheblue.queuepower.ca/wp-content/themes/snapshopWP_child/header.php (line 134 is where my edit begins and ends at line 138)

Any help you can provide with these issues would be greatly appreciated.

Thanks.

Replies

User Description Posted On
Shindiri Support team Administrator

Hi,

You were really thorough with your request we hope we did answer everything.
PROMO – PARALLAX PAGE
1) To add the effect you want, on a new page add a row, type

Top paddinng: 350px;
Bottom padding 350px;
Column padding 0p;

Background:

Type > Fade Parallax
Put the link to image inside upload field. (NOTE: Pictures need to be FULL HD - 1920x1080px)
Check box ticked Repeat Image.

Column Background:

Opacity: 100%
Column 1 Opacity: 100%

Repeat for all the images that you want to use as fade parallax. Always add a row and follow the instructions provided.

PARALLAX FADE EFFECT ON PRODUCTS SHIRT PAGE
2)
Nothing has been done from Revolution Slider, everything has been done from Frontend Builder. So all the effect you see can be recreated, use the Fade Parallax effect on rows. Everywhere you want to have parallax, select the shortcode or row to be parallax

ADDING REVOLUTION SLIDERS TO THE TOP OF PRODUCT PAGES
3)
Revolution slider can not be implemented into WooCommerce product as the top bar.

ADDING PLUS/MINUS BUTTONS TO THE QUANTITY BAR
4)
After the newest update of WooCommerce something went missing with their product settings. Our settings that you can check on our Demo is still with the old settings.

ADDING SOCIAL NETWORK ICONS TO THE HEADER BAR
5)
First of all you have to enable  the header bar, which is by default disabled.
To do that go to your Snapshop Options > General > Header Bar  > Enable
Bellow that there is an option called Elements, enlarge it, and you will see a lot of elements
that can be activated for the left and right side bar. Social icons displayed drag the Network-icons shortcode.

Or if you want to display custom icons there is also a workaround to change header.php

Find header.php filde inside the snapshopWP folder. Open it and you will need to find two classes: snpshpwp_header_left, snpshpwp_header_right,
<div class="snpshpwp_header_bar">
<div class="snpshpwp_header_container">
<div class="snpshpwp_header_bar_elements">
<div class="snpshpwp_header_left float_left">
<?php
snpshpwp_elements('left', 'header_bar');
?>
[HTML CODE]// for left side
</div>
<div class="snpshpwp_header_right float_right">
<?php
snpshpwp_elements('right', 'header_bar');
?>
[HTML CODE]//for right side
</div>
<div class="clearfix"></div>
</div>
</div>
</div>

Those two classes are responsible for appending code in the header, so it you put something there, lets say HTML or a shortcode and you will than have a that content appended into your page.

If you can not do something on your own, contact us again on support@shindiristudio.com

Best regards,
Shindiri Studio | http://www.shindiristudio.com/

× This ticket is closed.