Jump to content

Macrura
 Share

Recommended Posts

hi all,

new PW site launch:  http://www.ohmspeaker.com/

some of the modules that were helpful or essential for this:

  • cropimage
  • formbuilder
  • fredi
  • importcsv
  • minify
  • piwik analytics
  • procache
  • batcher
  • redirects
  • version control
  • template decorator
  • modules manager
  • page link abstractor
  • sitemap xml
  • admin custom pages
  • markup simple navigation (for the sitemap)

forum topics related to this site dev:

Legacy Site URL redirects:

http://processwire.com/talk/topic/3641-redirect-legacy-url-to-new-pw-page/

Clean up spelling:

http://processwire.com/talk/topic/3519-use-api-to-spellcheck-whole-siteclean-up-spacing/

hashes in URLs on change selected product

http://processwire.com/talk/topic/3496-help-with-url-param-change/

FormBuilder

http://processwire.com/talk/topic/2904-how-to-redirect-by-id/

http://processwire.com/talk/topic/2821-3rd-party-send-conditionally/

http://processwire.com/talk/topic/2820-use-session-to-remember-form-selections/

Custom Menus

http://processwire.com/talk/topic/2787-custom-menu-not-related-to-page-tree/

other notes:

  • The skyscraper profile provided the example for how to get started with the advanced product search, a.k.a. the speaker finder.
  • The standard search has been extended to show results in different categories.
  • there is some use of Soma's word limiter for the news teaser text, and for making meta descriptions out of body fields, from this topic: http://processwire.com/talk/topic/3429-how-to-set-text-linecharacter-limits-in-templates/
  • the design is built on twitter bootstrap framework
  • Fredi proved to be totally essential for the client, in being able to rapidly edit things without having to find things in the admin.

This site is going to replace an existing site on a different domain (ohmspeakers.com).

At some point we weren't sure if/how we would be able to handle the shopping cart element, and then found foxycart, which proved to be the best choice, very flexible, and easy to implement for this type of site. FC is hands down the simplest and easiest way (imho) we could achieve things like the legacy product pages, where there are various parts and upgrades displayed on 1 page.

this version is sort of a "v1", and will be expanded/improved a lot for a v2, which would happen in about 4 months..

BTW - these speakers are really good; i now own 3 pairs :lol: ... they look great and do sound totally amazing...!

-marc

  • Like 26
Link to comment
Share on other sites

Marc,

Brilliant job! 

A few niggles :)....I know it's v1...

  1. Contact Us page: Submitting an empty form returns success message.
  2. Recommendation Form: Submitting an incomplete form does not give user feedback; nothing happens
  3. Search results: Maybe (minor issue) change the h2 headings for "Found X pages matching your query..." to h3?. Also "query" has always sounded to "dev-like" for me in search results :) Maybe found x pages matching your search? Minor issue!

Overall, really nice site!

btw: all the above Form Builder links return 404s
 

  • Like 1
Link to comment
Share on other sites

hi kongondo -

awesome! thanks for looking

#1 - fixed (made required)

#2 - not getting this, because the formbuilder is showing alerts for required fields, when they are not filled in (?)

#3 - changed h2 to h3.. and i agree about the 'query'...changed to search...

the formbuilder links won't work, sorry, unless you are a formbuilder registered user (it's a 'VIP' forum) :P

  • Like 1
Link to comment
Share on other sites

Great site and thanks for your writing. It is always nice to know about what modules used and really nice that you even linked those related forum topics. 

Fredi proved to be totally essential for the client, in being able to rapidly edit things without having to find things in the admin.

Happy to hear that!

  • Like 1
Link to comment
Share on other sites

#2 - not getting this, because the formbuilder is showing alerts for required fields, when they are not filled in (?)

Aah. I didn't see the alert because it is a long form so the alert is hidden from view. It is possible to scroll the form up using jQuery to the first missing required field, no?

Link to comment
Share on other sites

Aah. I didn't see the alert because it is a long form so the alert is hidden from view. It is possible to scroll the form up using jQuery to the first missing required field, no?

I think that alert is browser's native alert. Those have some nasty usability problems still (like this one at least on chrome). It doesn't submit the form and it doesn't scroll to position where user could see an error message.

Link to comment
Share on other sites

On firefox, it scrolls already right to the first empty field, which has a red halo around it;

this is using the latest stable version of FormBuilder;

are you saying that FormBuilder is using browser native alert? I thought this was jQuery UI..

-marc

Link to comment
Share on other sites

This form in Chrome: http://www.ohmspeaker.com/recommendation-form/

Leave it empty and click submit. Nothing seems to happen. This is because "Name, First" field has required="required" and chrome does that little poorly when form is in iFrame (doesn't scroll and shows the error message only for a while (you can see the alert if you scroll right after clicking the submit).

Firefox does it better (scrolls to the problematic field even inside iFrame). 

Without iFrame chrome does scroll too: http://www.ohmspeaker.com/form-builder/product-inquiry/

Link to comment
Share on other sites

thanks apesia, for bringing up this topic...  hopefully by the time i get to V2, i'll come up with a way to deal with that; i'm using jquery validate for another form on the site, maybe there would be a way to integrate that with FB..

i also forgot to include in the first post a little about how that project evolved and ended up with PW....

it started a long time ago when we first tried to do the site in Joomla, using RedShop; that was basically a disaster; RedShop promised all of the 'features' you could want, but was rife with problems and almost nothing worked. I found myself on the RedShop forum almost every day reporting bugs, spelling errors in the component etc.;  then Joomla 1.5 reach EOL, and we tried to upgrade, and that failed in many ways also (components, template etc..)..

once i found processwire, the plan was to do a simple corporate brochure site, which would be like a product catalog, no ecommerce.

During the work on that, i experimented with csv import on another PW site and discovered how to easily import the old website data, so that it took only a few hours to import the existing relational product database (MSaccess/Cold Fusion);

And then i read about foxycart, so that became the solution for the parts store, since the existing site provider was discontinuing CC transactions on their servers, i guess they are not PCI compliant; Once we got that going, it was just a small step to enable add to cart buttons for the 'current' product line...

  • Like 3
Link to comment
Share on other sites

Nice site. Just one thing, I was surprised at the lack of product images on the single product pages (SSP) and the select finish options do not have images.

I might be wrong but for me it's like walking into a shop and reading the label but not seeing the product.

Link to comment
Share on other sites

@Jason & alanfluff -thanks for checking out the site, much appreciated.

@NooseLadder - thanks for looking and yes, you're completely on point, the company is a very small business with limited resources...(basically a one-man operation) but there is a plan to photograph all of the products for 'V2'...

For the veneers, there is a 'veneer gallery' for this version, and there will be a 'veneer picker' on the product pages for V2 which will be a popup lightbox that lets you see the veneers close up and select one, for which the selection will populate the veneer choice select box.

also in the works would be validation for the veneer selection (to make sure a value is selected).... i haven't been able to figure out foxycart add-to-cart validation yet and am waiting on a reply to a post in the FC forum as to how i can use jquery.validate with FC, which would make things super easy..

-marc

  • Like 1
Link to comment
Share on other sites

Greetings,

Wow, Macrura, beautiful site.  Really professional and smooth.

When you build sites like that, no wonder the client loves ProcessWire and the community behind it!

I see you are using FoxyCart for the e-commerce elements.  I'd be really curious to hear more of how you like integrating FoxyCart with PW.

Very interesting that the client is offering a 20% discount in honor of ProcessWire.

Thanks for sharing,

Matthew

Link to comment
Share on other sites

@mathew - thanks for looking;

the foxycart for this site was very simple/easy and flexible to implement;

i have no complaints overall except that i wish i could do validation easier on the add to cart buttons; but i'll probably get that sorted soon. 

the FC people are always helpful and polite; the system runs perfectly smooth as far as i can tell so far.

It's a little tricky to integrate the checkout page into your site; since they host the checkout pages on their servers, they have to cache your 'checkout' template, which can be problematic if you have a complicated design (it didn't seem to like bootstrap); i wasn't able to get that working this time around, so i'm using the default checkout, which is also fine; maybe not as elegant as having the checkout look like it's part of the same site.

ecommerce is definitely not my 'thing' so foxycart will probably be my 'go-to' solution, since it sort of just plugs in and works...

Link to comment
Share on other sites

Hi Macrura,

excellent site, very clear and well organized!

Could you please provide some infos on how you developed the "speaker-finder" section ? I'm really interested on how you've managed the filtering and selections of the various products.

Thumbs up!

Link to comment
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
 Share

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Markus Thomas
      One of my first projects with ProcessWire.
      Online for a while, but still up to date and currently new features are being developed again.
      The most interesting feature of the site is the integration of the external tool and the PDF creation of the registration form with integrated API connection to always be able to directly output the most current dates.
       
      External Service:
      SEMCO ( https://www.semcosoft.com/de/ )
      Used Modules:
      HannahCode Pages2PDF AIOM+ MarkupSitemap XML and some others In Development:
      Shop with Padloper Site: https://www.school-dynamic.de/
      At this point I like to say Processwire makes it so easy for me to solve even more complicated tasks and get impressive results. Because I must confess, my PHP skills are unfortunately not yet where I would like to be.  

    • By Markus Thomas
      My wife loves to cook, and I always like to further my knowledge around Processwire. So I thought I'll build a small page with the some small function to learn something.
      Used modules:
      ProMailer RepeaterMatrix Pages2PDF AIOM and some other litte modules Current functions:
      JSON-LD for recipes and page search Automatic ingredient calculation when changing the number of servings Creation of a PDF of the recipe Basic PWA (here is something to do, actually) Planned functions:
      a lot 😉  
      Site: https://www.dothiscookingthing.de

    • By benbyf
      https://www.tandc.games/
      New website for my games design company. We're currently working on Grace Hopper: Bug Rescue about computer science history, check it out and let me know if you have any suggestions for historic characters or topics/hardware.
      Built with PW, and is heavy built upon my other website https://www.ethicalby.design/ basically taking it as a base and building on it.

    • 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 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
×
×
  • Create New...