Jump to content
cstevensjr

Online Store - Yellow Ro's Creations

Recommended Posts

IMG_0436.thumb.PNG.6eaf1e121c24945917536c7d671c0e99.PNGIMG_0439.thumb.PNG.c17a374430a6352feb671e626010d552.PNG

 

This is the first collaborative project that my wife and myself have worked together on.  The goal was simple --- Create a public online experience that showed off the "Custom Artisan" jewelry that she has made for years.

https://yellowrosecreations.biz

The website is built around an e-commerce platform.  Through ongoing work with a new client of mine, I had gotten to know about Ecwid as an e-commerce solution that was tied in closely in with Square (a financial services, merchant services aggregator and mobile payment company).  My work with Ecwid for the past few months afforded me with the opportunity to get this web project up and online in no time.  Let me be clear, while this e-commerce solution works fine, our long term goal is to use Padloper for the online store.  That long term goal is more about controlling where our data resides and being able to freely enhance the total shopping experience.  I already know that a solution based on ProcessWire will give us the ultimate e-commerce flexibility.

The great thing about the ProcessWire platform is that there are numerous tools that enable you to get things done.  To my delight, I discovered that using the Hanna Code module allowed me to easily integrate Ecwid (which actually means e-commerce widget) code into a ProcessWire website. I will write a separate article about how that works at a later time. 

The website makes use of the UnSemantic Responsive CSS grid with Zurb Foundation components added/mixed in.  This is an unconventional combination to use, but it works for us.  

On the ProcessWire side, there were a few critical modules that contributed to gettng this website online:

  • TextformatterHannaCode
  • ProcessDatabaseBackups
  • CronjobDatabaseBackup
  • AdminLinksInFrontend
  • ProCache
  • FormBuilder
  • PrevNextTabs
  • WireMailSmtp
  • ImportPagesCSV
  • ProcessEmailToPage
  • MarkupProcesswirePhotoswipe

Hanna Code snippets were used throughout to populate the Ecwid Online Shopping Bag, the Ecwid Main Online Store, different Ecwid Product Category Listings, the green Foundation Buttons in the website sidebar and some other webiste features.

ProcessWire Page Table and Page Reference fields were instrumental in generating the product descriptions that are used on the Ecwid Online Store.  Each jewelry item has it's own page within ProcessWire that can be later used with the Padloper e-commerce solution.

yrcw-be1.thumb.png.86579a19ed83ffae1a486712ecf6aa39.png

On the backend side, we were able to create a repository page that keeps track of each product, SKU, pricing and their current disposition status related to the Online Store.

yrcw-be2.thumb.png.1e6cf483b511dd15825272e8dd063e3d.png

This has been a fun and fascinating project to work on.  It took us a few weeks to get everything worked out. As I have said before, ProcessWire makes projects of this type possible because you are not limited by the front-end framework you can use.  Even when there are not dedicated modules to incorporate a feature that you like, this platform and it's openness allows you to do things that are impossible to do on other systems.  It just takes a little ingenuity, planning and time on your part to make things work.

 

IMG_0437.PNG

IMG_0438.PNG

IMG_0440.PNG

IMG_0441.PNG

IMG_0448.PNG

IMG_0449.PNG

IMG_0450.PNG

IMG_0451.PNG

  • Like 12

Share this post


Link to post
Share on other sites

Hi @cstevensjr - nice looking site and story. I hope it proves successful for you wife.

One small thing - I noticed that all the links in the sidebar open in a new tab - I assume that this isn't intentional?

Cheers,
Adrian

  • Like 1

Share this post


Link to post
Share on other sites
1 hour ago, adrian said:

Hi @cstevensjr - nice looking site and story. I hope it proves successful for you wife.

One small thing - I noticed that all the links in the sidebar open in a new tab - I assume that this isn't intentional?

Cheers,
Adrian

Thanks.  I will have a look at the links.

Share this post


Link to post
Share on other sites

Excellent caste study, best wishes @cstevensjr. Now I am planning my next Online Store project in procewsswire if possible. I am just running all ower PW forums for possible understanding 

Share this post


Link to post
Share on other sites

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

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Pip
      Hi, Everyone! 
      I'm currently working on a page reference field and set it for multiple pages (AsmSelect) for the input. Is there a way for me to add an image field (aka Avatar) and the title of page in the radio button? 
      I used the field name enclosed in the { }. Didn't work. It appeared a text instead. 
      Thanks in advance and hope to hear from you soon!
    • By jonatan
      Hi! 😄
      SITE SETUP / DESCRIPTION:
      What? Online art magazine with an "All featured works" and also an "All featured artists" index page, and also individual "Work" and "Artists" pages, and data relations between the different artists and their artworks.
      So, I have two different page reference fields, connected by @Robin S's awesome Connect Page Fields module (though that has nothing to do with the issue in fact, Robin's plugin works great! and the issue is the same with or without it).
      The two Page Reference type fields are called "works" and "artists". They are meant to simply connect different artists to different artworks.
      Fx:
      Work 1  (page)  –> artists (Page Reference field) : Artist A (page)           --->>> (automatically connected)         Artist A (page)  –> works (Page Reference field) : Work 1 (page)
      Work 2  (page) –> artists (Page Reference field) : Artist B  (page)           --->>> (automatically connected)         Artist B (page)  –> works (Page Reference field) : Work 2 (page)
      ISSUE:
      On both Page Reference fields, both on "artists" and on "works" this option "Allow unpublished pages" is activated:

      As it says in the option description, supposedly, unpublished pages should be selectable in the page reference field, but they should not be visible, they shouldn't appear, on the front-end...
      Frontend:
      To show all works related to the artist on the artist individual page I'm doing this:
      <?php foreach($page->works as $item) { echo "<img src='{$item->image->first->width(200)->url}' class='pr-2'><a class='pr-4' href='$item->url'>$item->title</a>"; } The problem is now, unexpectedly, if some work is set to "Unpublished", it shows up anyways!
      WORKAROUND:
      So to get around this I figured out that I can do this:
      <?php foreach($page->works as $item) { if($item->is(Page::statusUnpublished)) { return; }; echo "<img src='{$item->image->first->width(200)->url}' class='pr-2'><a class='pr-4' href='$item->url'>$item->title</a>"; } But ofc this is a rather inelegant "solution" which shouldn't really be necessary, right? 
      I might be missing something basic here, but really can't figure out what it is... I hope one of you awesome guys can help me out 😊
      Thanks a lot in advance!
      All the best,
      Jonatan
    • By Flashmaster82
      Hi, can you guys help a beginner with a problem..
      On my template (profile_page) i have a dropdown (page reference) where i can choose a sports team (team_page) that is related to that profile which is also its parent. Then on my Competition1 page (competition_page) I have page reference field (profiles) a dropdown that i want to display only profiles that has choose a specific sports team (template=team_page) the page parent to be specific.
      Structure/Template
      Sports_team1 (team_page)
           Profile1 (profile_page)
           Profile2 (profile_page)
           Profile3 (profile_page)
           Competition1 (competition_page)
       
      ready.php
      <?php $wire->addHookAfter('InputfieldPage::getSelectablePages', function($event) { if($event->object->hasField == 'profiles') { $relative = $page->parent->name; $event->return = $event->pages->find("template=profile_page, sports_team=$relative"); } }); ?> This returns with no results in the dropdown. If i remove sports_team=$relative then it displays all profiles that have profile_page as template, so it works almost. But i will have more sports teams so this is just an example. I only want to display the profiles that has choosen the parent team on there profile page in admin not front end.
      I hope i was able to explain it so you guys can understand a little bit. Need some help please! /Thanks
       
       
    • By MaierGrem
      Question to professionals)
      I use the "Page Reference" field (name = categories, types = multiple, asm-select) and checkbox field (name = notify_user).
      When editing the page, I need to check if:
      - (categories) values has changed (deselected one or more current pages), make (notify_user) required.
      - (categories) values has changed (selected one or more new pages), make (notify_user) required.
      - (categories) values don't change, then the (notify_user) is not required.
      I tried to make a condition, required if:
      1. "categories!=1020|1490" - does not work.
      2. "categories!=1020|1490, categories.count != 2" - does not work.
      3. "categories%=1020|1490 - js error.
      Please advise how best to solve this problem.
    • By Macaco
      It's a bilingual site. There are two pages: "Artists" and "Events" each with a "Page Reference" field connecting each other.
      - Artists has a field where one can choose events available.
      - Events has a field where you can either choose artists available or create new ones.
      The problems: 
      - When I create an "Artist" page and select events from the list, it doesn't update the collection of participating artists on the "Event" page.
      - When I create an artist from the "Event" page. The field 'artist page > settings > language' is not "Active" for the second language.  When the artist page is created manually,"Active" is on by default.
      I know this all have to do with hooks, but I'm don't fully understand the logics.
×
×
  • Create New...