Forum

Thread tagged as: Problem, Shop

Perch Shop - Product detail page

I'm having a bit of trouble trying to get a product to show (after clicking on it from the product list page), please help! The steps I've take so far are:

  • I've downloaded the shop files from GitHub and played around with the demo site.
  • Set up a /shop page (that has the <?php perch_shop_products() ?> function to get the list of all the products.
  • Set up the basket and checkout pages (these work fine).

The issue I'm having is that when I click on the products from the list page I'm unsure how to use the <?php perch_shop_product() ?> function to go through to a page that only has that specific product that I've clicked on. It's probably the most simple question but any help would be great, thank you.

I'm not using Runway too, just Perch 3.
Kieran Brown

Kieran Brown 0 points

  • 3 years ago
Robert Ketter

Robert Ketter 103 points

3 years ago

You need to pass the product “slug” to the perch_shop_product() function to get the details for a specific product. Best to hard code the slug of an item first to make sure the function is working in your setup.

Please make sure to post your template with any additional question

:)
Kieran Brown

Kieran Brown 0 points

3 years ago

Thanks for your quick reply Robert :)

Here's my very simplistic templates, as I've tried hard coding a product into the perch_shop_product().

Shop Page

<?php if (!defined('PERCH_RUNWAY')) include($_SERVER['DOCUMENT_ROOT'].'/perch/runtime.php'); ?>
<!DOCTYPE HTML>
<html lang="en-GB">
<head>

<!-- Title -->
<title><?php perch_pages_title();?> | Shop Test</title>

<!-- META -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0" />
<?php perch_page_attributes(array('template' => 'seo.html'));?>

<!-- CSS -->
<link href="/css/screen.min.css" rel="stylesheet" type="text/css" media="screen" />
<link href="https://fonts.googleapis.com/css?family=Roboto:900|Work+Sans:200" rel="stylesheet" />

</head> 
</body>

    <?php perch_layout('shopheader'); ?>

    <div class="big-box header-clear"><h1><?php perch_content('Main heading'); ?></h1></div>
    <!-- Main Container -->
    <div class="page-width">
        <div class="main-container">        
            <div style="display:block;width:100%;">     

                <?php perch_shop_products() ?>


            </div>      
        </div>

    </div>
    <!-- End Main Container -->

    <?php perch_layout('shopfooter'); ?>

</body>
</html>

product detail page (product.php)

<?php if (!defined('PERCH_RUNWAY')) include($_SERVER['DOCUMENT_ROOT'].'/perch/runtime.php'); ?>
<!DOCTYPE HTML>
<html lang="en-GB">
<head>

<!-- Title -->
<title><?php perch_pages_title();?> | Shop Test</title>

<!-- META -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0" />
<?php perch_page_attributes(array('template' => 'seo.html'));?>

<!-- CSS -->
<link href="/css/screen.min.css" rel="stylesheet" type="text/css" media="screen" />
<link href="https://fonts.googleapis.com/css?family=Roboto:900|Work+Sans:200" rel="stylesheet" />

</head> 
</body>

    <?php perch_layout('shopheader'); ?>

    <div class="big-box header-clear"><h1><?php perch_content('Main heading'); ?></h1></div>
    <!-- Main Container -->

    <div class="page-width">
        <div class="main-container">

        <?php
            perch_shop_product('test-product-02', [
            'template' => 'product.html'
            ]);
        ?>

        </div>
    </div>

    <!-- End Main Container -->

    <?php perch_layout('shopfooter'); ?>

</body>
</html>

So on the shop page I've got anchor tags around the products (which is coming from the the list.html file). However After putting in a hard coded slug to the 'test-product-02' it injects that string into the url as ( /shop/?product=test-product-02 ) however the other products are still apparent along with this one. It's as if I'm missing a step to only show the product I've clicked on rather than the rest of the products as well.

<perch:form id="add_to_cart" app="perch_shop" action="/basket">
    <div class="product boxer">
        <a href="/shop/<perch:shop id="slug" type="slug" />">
            <perch:if exists="image"><img src="<perch:shop id="image" type="image" width="200" height="200" density="1.6" crop="true" />" alt="<perch:shop id="title" />"></perch:if>
            <div class="box shop minor boxed">
                <h2><perch:shop id="title" /></h2>
                <perch:shop id="description" type="textarea" />
                <perch:if exists="has_variants">     
                    <perch:input id="product" type="select" class="variants" options="<perch:shop id="_variant_opts" type="hidden" />" placeholder="Please choose" required="true" />
                <perch:else />
                    <perch:input id="product" type="hidden" value="<perch:shop id="productID" type="hidden" />" />
                </perch:if>
                <div class="buy">
                    <span class="price">
                        <perch:shop id="current_price" type="shop_currency_value" />
                    </span>
                    <button class="button">Buy Now</button>
                    <perch:input type="cms" />
                </div>
            </div>
            </div>
        </a>
    </div>
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

Can you post your diagnostic report please?
Robert Ketter

Robert Ketter 103 points

3 years ago

Kieran,

Your form has no

method=“post”

So by default (get) will add all the fields to the url as a query string which is the behavior you describe. This is fine and working, I am just explaining why it adds to url.
Kieran Brown

Kieran Brown 0 points

3 years ago

Thank you, I'll change the method to post when I'm back at my computer.

Here's my diagnostic report...

Perch information

Perch: 3.0.10
Production mode: Production (100)
Installed apps: content (3.0.10), assets (3.0.10), categories (3.0.10), perch_blog (5.6.1), perch_forms (1.9), perch_shop_orders (1.2.5), perch_shop_products (1.2.5), chirp_seo (1), perch_shop (1.2.5), perch_members (1.6.2)
DB driver: PDO
DB tables: perch2_blog_authors (1), perch2_blog_comments (3), perch2_blog_index (748), perch2_blog_posts (10), perch2_blog_posts_to_tags (13), perch2_blog_sections (1), perch2_blog_tags (16), perch2_blog_webmention_queue (0), perch2_blogs (1), perch2_categories (1), perch2_category_counts (0), perch2_category_sets (3), perch2_chirp_seo (5), perch2_content_index (935), perch2_content_items (224), perch2_content_regions (36), perch2_forms (1), perch2_forms_responses (2), perch2_members (0), perch2_members_forms (0), perch2_members_member_tags (0), perch2_members_sessions (0), perch2_members_tags (0), perch2_menu_items (15), perch2_navigation (0), perch2_navigation_pages (0), perch2_page_templates (11), perch2_pages (11), perch2_resource_log (309), perch2_resource_tags (0), perch2_resources (120), perch2_resources_to_tags (0), perch2_settings (37), perch2_shop_addresses (0), perch2_shop_admin_index (30), perch2_shop_brands (1), perch2_shop_cart (3719), perch2_shop_cart_data (94), perch2_shop_cart_items (29), perch2_shop_countries (250), perch2_shop_currencies (152), perch2_shop_customers (0), perch2_shop_emails (1), perch2_shop_index (304), perch2_shop_option_values (1), perch2_shop_options (1), perch2_shop_order_items (0), perch2_shop_order_promotions (0), perch2_shop_order_statuses (9), perch2_shop_orders (0), perch2_shop_orders_meta (1), perch2_shop_product_files (0), perch2_shop_product_option_values (1), perch2_shop_product_options (2), perch2_shop_product_tags (0), perch2_shop_products (4), perch2_shop_promotions (1), perch2_shop_sales (0), perch2_shop_search (4), perch2_shop_shipping_zone_countries (1), perch2_shop_shipping_zones (1), perch2_shop_shippings (1), perch2_shop_tax_exhibits (0), perch2_shop_tax_group_rates (1), perch2_shop_tax_groups (1), perch2_shop_tax_locations (1), perch2_shop_tax_rates (1), perch2_shop_variants (0), perch2_user_passwords (2), perch2_user_privileges (81), perch2_user_role_privileges (16), perch2_user_roles (2), perch2_users (1)
Users: 1
App runtimes:
<?php
    $apps_list = array(
        'perch_blog',
        'perch_members',
        'perch_shop',
        'perch_forms'
    );
Scheduled tasks for perch_blog: delete_spam_comments (1440 mins), publish_posts (1 mins), process_webmentions (1 mins)
Editor plug-ins: config.js, redactor-plugins
H1: a1885ad3d541ea30fea437c299e84a9f
L1: 8aba51d5b8d527665d0c32169f9529f6
F1: 3b606135b33e6a102526838f4152a807
headerColour: #2d2d2d
content_singlePageEdit: 1
helpURL:
hideBranding: 0
content_collapseList: 1
lang: en-gb
update_2.8.34: done
latest_version:
on_sale_version:
perch_blog_update: 5.6
perch_blog_post_url: /blog/{postSlug}
headerScheme: dark
perch_blog_site_name: Kieran Brown
perch_blog_slug_format: {postTitle}
perch_blog_akismet_key:
perch_blog_comment_notify: 1
perch_blog_max_spam_days: 0
dashboard: 1
hide_pwd_reset: 1
content_hideNonEditableRegions: 1
content_frontend_edit: 0
update_3.0: done
siteURL: https://www.kieranpbrown.co.uk
chirp_seo_license_key: XXCKW-WZ1RP-A1P9V-AJ1NF
perch_shop_update: 1.2.5
perch_members_update: 1.4
perch_members_login_page: /members/login.php?r={returnURL}
perch_shop_price_tax_mode: exc
perch_shop_site_url: https://www.kieranpbrown.co.uk
perch_shop_product_url: /shop/{slug}
perch_shop_default_currency: 47
perch_shop_reporting_currency: 47
perch_shop_invoice_number_format: Invoice%d
update_3.0.3: done
content_skip_region_list: 0
update_3.0.10: done
PERCH_DEVELOPMENT: 10
PERCH_STAGING: 50
PERCH_PRODUCTION: 100
PERCH_DB_USERNAME: dbo668221826
PERCH_DB_SERVER: db668221826.db.1and1.com
PERCH_DB_DATABASE: db668221826
PERCH_DB_PREFIX: perch2_
PERCH_TZ: UTC
PERCH_EMAIL_FROM: hello@kieranpbrown.co.uk
PERCH_EMAIL_FROM_NAME: Kieran Brown
PERCH_LOGINPATH: /perch
PERCH_PATH: /homepages/41/d604971069/htdocs/portfolio/perch
PERCH_CORE: /homepages/41/d604971069/htdocs/portfolio/perch/core
PERCH_RESFILEPATH: /homepages/41/d604971069/htdocs/portfolio/perch/resources
PERCH_RESPATH: /perch/resources
PERCH_HTML5: 1
PERCH_CUSTOM_EDITOR_CONFIGS: 1
PERCH_RUNWAY:
PERCH_ERROR_MODE: DIE
PERCH_DATE_LONG: %d %B %Y
PERCH_DATE_SHORT: %d %b %Y
PERCH_TIME_SHORT: %H:%M
PERCH_TIME_LONG: %H:%M:%S
PERCH_RUNWAY_ROUTED:
PERCH_STRONG_PASSWORDS:
PERCH_ASSET_VERSION: 23f8a1427c17ade109a3
PERCH_DEBUG:
PERCH_PREVIEW_ARG: preview
PERCH_TEMPLATE_PATH: /homepages/41/d604971069/htdocs/portfolio/perch/templates
PERCH_TEMPLATE_FILTERS:
PERCH_DEFAULT_DOC: index.php
PERCH_DEFAULT_EXT: .php
PERCH_PRODUCTION_MODE: 100
PERCH_XHTML_MARKUP:
PERCH_RWD: 1
PERCH_HTML_ENTITIES:
PERCH_SSL:
PERCH_STRIPSLASHES:
PERCH_PROGRESSIVE_FLUSH: 1
PERCH_PARANOID:
PERCH_FORCE_SECURE_COOKIES:
PERCH_DEFAULT_BUCKET: default
PERCH_TRANSLATION_ASSIST:
PERCH_PASSWORD_MIN_LENGTH: 6
PERCH_MAX_FAILED_LOGINS: 10
PERCH_AUTH_LOCKOUT_DURATION: 1 HOUR
PERCH_VERIFY_UPLOADS:
PERCH_PRIV_ASSIST:
PERCH_ENABLE_EXIF: 1
PERCH_AUTH_PLUGIN:
PERCH_DB_CHARSET: utf8
PERCH_DB_PORT:
PERCH_DB_SOCKET:
PERCH_APPS_EDITOR_PLUGIN: markitup
PERCH_APPS_EDITOR_MARKUP_LANGUAGE: markdown
PERCH_SHOP_VERSION: 1.2.5