Jump to content

Fundraiser webshop


Typografics
 Share

Recommended Posts

Each year we cycle 1000km with our company to fight against cancer. To participate with 4 teams we have to collect 20.000 euros.

Our graphic designers made some goodies en we also organise a spaghetti fundraiser. To help the sales we decided to make a webshop with our webteam. And of course we used our favourite CMS for the job! 🙂
https://shop.typografics.be/

At this moment we raised more than 20.000 euros, so all our teams can participate. This is a very special project for us, unfortunately one of our colleagues has been diagnosed with cancer and currently is fighting against this terrible disease. 

Premium PW modules used in this project:
PadLoper
FormBuilder
ProFields
Variations

With a few hooks here and there we managed to make it work. To handle the payments we made use of Mollie, we created our own payment module and will opensource this soon.

You can read more about this project in our blog (in dutch) 

Unfortunately we're currently only shipping to Belgium

We’re already brainstorming to make a 2.0 version of this webshop, so all your feedback is more than welcome.

  • Like 17
Link to comment
Share on other sites

Very nice!

Me too I like your payment way. I didn't know it maybe I will you too.

How you have setup the product page for ask the double variation of product? I mean you ask for the 1° variation the Size on the T-short and the 2° if men or woman. How did you do it?

The only things that I not like a lot is that: if i'm on one category page, like Tate Bag, and change language the page start again from the homepage. and I have to click twice for change language. In the single product page this not happen. Also in the cart happen something to similar to change language.

Anyway I like it! good job!

Link to comment
Share on other sites

21 hours ago, MarcoPLY said:

How you have setup the product page for ask the double variation of product? I mean you ask for the 1° variation the Size on the T-short and the 2° if men or woman. How did you do it?

I don't know if this is the exact method used by the developer, but there is a tutorial for using the variations module with padloper here: https://variations.kongondo.com/demo/

It's a great looking site, and an awesome demonstration of some premium modules I'm looking to use in a new project. I'm glad you mentioned ProFields as that looks like a big time saver I was aware of but hadn't really looked into before. 

Best of luck to your colleague, I also have a colleague recently diagnosed and it's a horrible disease.

  • Like 1
Link to comment
Share on other sites

On 4/13/2018 at 4:36 PM, MarcoPLY said:

How you have setup the product page for ask the double variation of product? I mean you ask for the 1° variation the Size on the T-short and the 2° if men or woman. How did you do it?

We check the stock trough an Ajax call each time the user selects an option. If it's not in stock anymore, the button "add to cart" stays not clickable. If it's in stock the user can add it to the cart. We also set an max in the quantity field, that's the same value as the stock is.

Javascript

clothing = {

    size: "",
    sex: "",
    product_id: "",

    init: function() {

        $('input[name="Size"], input[name="Sex"]').on('change', function (e) {

            clothing.size = $('input[name="Size"]:checked').val();
            clothing.sex = $('input[name="Sex"]:checked').val();
            clothing.product_id = $('#product_id').val();

            if(clothing.sex && clothing.size && clothing.product_id) {
                clothing.getVariationId();
            }
        });
    },

    getVariationId: function() {

        var url = '/api/?id=' + clothing.product_id + '&variation=clothing&size=' + clothing.size + '&sex=' + clothing.sex;

        $.ajax({
            type: 'GET',
            url: url,

            success: function(result) {

                if(result){

                    var res = JSON.parse(result);

                    if(res.success){

                        if(res.qty > 0){

                            $('#qty').prop('disabled', false);
                            $('#qty').parent().removeClass('c-form-group-disabled');
                            $('#qty').attr("max", res.qty);

                            $('#variation_id').val(res.id);

                            $('#clothing .c-button').prop('disabled', false);
                            $('#clothing .c-button').removeClass('c-button-disabled');

                        } else {

                            $('#qty').prop('disabled', true);
                            $('#qty').parent().addClass('c-form-group-disabled');
                            $('#qty').attr("max", 0);
                            $('#qty').val(0);

                            $('#variation_id').val("");

                            $('#clothing .c-button').prop('disabled', true);
                            $('#clothing .c-button').addClass('c-button-disabled');
                        }
                    }
                }
            },

            error: function(jqXHR, textStatus, errorThrown){

            }
        })
    },
};

 

api.php

<?php namespace ProcessWire;

if(config()->ajax()) {

    $data = array(
        'success' => input()->get('id')
    );

    if(!input()->get('variation')){
        return json_encode($data);

    } else {

        switch (input()->get('variation')){

            case "clothing":

                if(!input()->get('id') || !input()->get('size') || !input()->get('sex')){
                    return json_encode($data);
                } else {

                    $product_id = input()->get('id');
                    $size = input()->get('size');
                    $sex = input()->get('sex');

                    foreach (pages()->get($product_id)->product_variations as $v) {
                        if (($v->size == $size) && ($v->sex == $sex)) {
                            $data = array(
                                'success' => true,
                                'id' => $v->id,
                                'qty' => $v->product_quantity
                            );
                            return json_encode($data);
                        }
                    }
                }
            break;

            case "default":
                return json_encode($data);

                break;
        }
    }

 

On 4/14/2018 at 2:25 PM, DonPachi said:

I don't know if this is the exact method used by the developer, but there is a tutorial for using the variations module with padloper here: https://variations.kongondo.com/demo/

Indeed we used the demo of @kongondo as a starting point.

  • Like 2
Link to comment
Share on other sites

  • 3 weeks later...
  • 4 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Similar Content

    • By kongondo
      Announcing the current status, planned release, roadmap and preview of Padloper 2.
      Status
      Feature freeze. Full multilingual support. Only PHP 7.2+ supported. Support for ProcessWire 3.0 only. Backend support for modern browsers only (that support JavaScript ES6 modules). Current Work
      Finish work on admin/backend. Work on installer and uninstaller (including configurable availability of some features). Work on UI/UX improvements. Start work on documentation with special focus on technical documentation. Continue work on Padloper API and data/model component. Roadmap
      Please note that these ARE NOT hard and fast targets. The roadmap may have to be adjusted to accommodate technical and non-technical constraints.
      Q1 2021
      Inbuilt support for (latest) PayPal (full rewrite, no external modules required). Additional work on Padloper API. Invite a limited number of early alpha testers (fully-priced product). Soft and closed release of Padloper 2.
      Q2 2021
      Start work on relaunch of Padloper website. Inbuilt support for Stripe (no external modules required). Future Plans
      Support for more Payment Gateways. Support for order, customers, etc imports and exports. Support for AdminThemeReno and AdminThemeDefault. Separate fully-featured frontend shop module. Consider support for multiple currencies. FAQ
      1. Have you abandoned this project? 
      No.
      2. When will Padloper 2 be released?
      First early alpha release is scheduled for Q1 2021. This target may change depending on circumstances! Access will be by invite only for this first release.
      3. What is the pricing model of Padloper 2? 
      Three licences: Single Site, Developer and Agency licences (12 months’ updates and VIP support).
      4. How much will Padloper 2 Cost?
      No price has been set yet. It will cost more than Padloper 1.
      5. Can we upgrade from Padloper 1?
      No.
      6. Will existing users of Padloper 1 get a discount for Padloper 2?
      No, this will not be possible. Apologies for the earlier announcement. It was unrealistic and unworkable.
      7. Can we pay for Padloper 2 in advance?
      No.
      8. Does Padloper 2 render markup/templates in the frontend?
      No. Access to all data you need to build your shop’s frontend is via the Padloper API.
      9. Can we keep sending you ‘Are we there yet’ messages?
      No, please.
       
      Preview
      Here is a video preview of the current state of the backend/admin of Padloper 2. Please note the following:
      This is early alpha. There are bugs! It even includes WIP/notes!! FOUC, misaligned things, etc. The video shows the near-raw implementation of Vuetify UI. The UI/UX improvements work is yet to start. What you see here is the development version.  Some of the incomplete features may not be available in the early releases. Most of the features you see will be optional to install.  

       
    • By picarica
      Hello so i am unable to get to cart/checkout menu , not sure how you even set it up, in the guide it just happend with no setup so what i got it is that i press submit after selecting product, and then it said that item is out of stock even tho i have 50 quantiny in the page, so i enabled negative stock so i could test this out and its weird
      after submit with negative stock i enabled i get this in the url
      localhost/vsetky-produkty/black2/?productId=1065&variationId=0&qty=1&totalQty=8&numberOfTitles=4&totalAmount=0
      but nothing in the page changes ? where is the next step, next step in the official website is payment modules
    • By picarica
      so hello i managed to make every step in padloper guide here https://www.padloper.pw/documentation/product-variations/
      but i got stuck that when i create my final product list those products dont have any check boxes, even tho when making color or size field i checked that there will be one choice only and yet when seen on the page its empty, any idea where i should be looking for fix ? i already tried to re-do the whole process but still same i am rpobably doing somethign wrong

    • By Jeannette
      Hello Fellows,

      I have a wonderful webshop, using PL and Padopt, a module developed by Julien Vaubourg and highlighted in ProcessWire Newsletter. Here is our shop: cheval-ami.fr
      I am looking for a new developer, helping me to keep the shop smooth and up to date.
      We would like to improve automated invoicing and worldwide shipping, getting DHL integrated and give people the possibility to create their personal accounts and be the nicest shop in the equine industry. We are still a young company, working all in german, english and french. We are very interested in a long time, kind and friendly relationship without any stress, but reliable reactivity in case of urgency. 
      We are based in Hamburg and near Paris and would prefere to work with somebody who is available to catch up around a table, at least sometimes.
      Contact: mail@cheval-ami.fr or +33 626 22 1000 or +49 170 20 28 215
      Thank you, Have a beautiful day,
      Jeannette
    • By Chris B
      Hi,
      I have to develop an e-commerce for a client who sells trips. He wants the customer to be able to enter the contact details for each participant in the order process.
      Ex: if I order a stay for two participants, then in the order process, I should have two information area for each person (firstname, lastname, address, birth, etc.). Then I will have to store the data in the order.
      Can we customize padloper like this?
      thank u
×
×
  • Create New...