Designing e-commerce shop page and single product page - what is the correct approach? - html

I have been working on an e-commerce site design (self-learning). The site is a clothing shop and it has many categories (like saree, stoles, dresses, etc) and many subcategories (i.e. under saree it has cotton and khadi, under cotton it has plain and stripped and so on).
Every category is supposed to have multiple products displayed as a grid (that is 'shop' page). When I click on a product, it should redirect to a single product page.
Now I cannot decide what would be the best way to start designing those pages. Should I create only a single shop page design for all the category shop pages or should I create a dedicated page for every category shop?
Same is for the single product page. Should I create one design and then fill the image, description, price from the database according to the product code, or should I have a dedicated page?
I am using HTML 5 and Bootstrap 4. I have searched google but I cannot find any relevant answer.
If this question seems silly or dumb or both, please know that I am a beginner and willing to learn more. Help will be appreciated. 😃

E-commerce websites have standard features and capabilities. In order to find out the basics of these standards, I recommend you to view and analyze the features of open-source projects such as NopCommerce which is an open-source project based on .Net framework and enhanced by client frameworks like Bootstrap.

Related

Pagination And Categories

I'm in a deep trouble like I'm creating a gaming website in HTML.
The website is great the problem is category and pages.
Like how to manage my games categories and the page like if I create a website based on 200 (all pages on games) pages but in future if I add more 50 pages (new games).
So do I have to rename all my pages when ever I add new pages / games?
And don't ask me to convert on WordPress I have tried and it mess up my style totally because I have zero experience on WordPress and the other platforms like WordPress.
I think some content management system is what you need. If you don't like wordpress there are other options. Maybe Google Sites would work for you?

E-commerce and Bootstrap

I have been creating websites in html and Wordpress for a while, but recently I was asked to look at a website that had been created very badly with a bootstrap based CMS, they were ripped off big time.
I understand that Bootstrap is basically a collection of styles etc but what I do not seem to be able to find is how to integrate a bootstrap template that I will purchase into a website with e-commerce functionality. The template has all the needed shop pages etc I just need to know how I go about making the online shop using the template.
Bootstrap is not a collection of styles -- its a templating system that modifies the layout of the web page content based on the users 'viewport'. in other words it changes the page design for smaller screens like mobile smart phones and tablets. its awesome for e-commerce especially considering the rising growth of sales over mobile,
but otherwise you don't make an online shop with a template, its kind of the other way around. so unless you really want to learn e-commerce programming, consider using a dedicated service like http://www.shopify.com If you want to integrate e-commerce with an existing website, http://www.foxycart.com is very good.
If you are moving it to a completely new setup and are comfortable using WordPress you could use that as a CMS and add e-commerce functionality using WooCommerce. It's trivial to add the plugin and configure it, and customising it is straightforward as it has a pretty good template hierarchy system that makes it easy to override using your own custom templates. It also uses a comprehensive set of filters and actions so custom functionality can be added in future if required.
In terms of adapting an existing theme (Bootstrap-based or otherwise) to work with WooCommerce it's just a case of creating additional templates if required and adding some additional CSS if need be. I'd recommend doing that using a child theme so that the parent theme can be updated in the future without overriding any of your customisations.
The advantage of this setup is that you're working on a platform you're comfortable with (WordPress) and there's a fair amount of support and articles available to help you along. The client would also benefit as it's a pretty popular solution, so they shouldn't have any trouble finding devs/or agencies to work on it in the future (just in case you aren't available).
One potential disadvantage is the WC can be a bit sluggish; I'd recommend not being cheap when it comes to your choice of hosts. I've used TSO before and would recommend them.

How to allow clients to manage their website?

I do small websites for local companies. All I know is HTML5 and CSS3, no JavaScript, no PHP.
I have this client who wants me to make a website for his coffee shop. All good so far. I have an idea for a beautiful responsive design which will get his coffee shop a lot of fame.
The problem:
The guy wants to be able to manage his website, meaning: he wants to add a photo if he needs to, or even some text on a particular page. He doesn't want to depend on me so he wants to do it by himself. The problem is that I can't teach him HTML so he would download the HTML file and write the code for the desired thing.. I need to do beautiful websites for my portfolio.
No Wordpress: I don't like Wordpress because it's limited so I can't be creative with the design. I thought of that as being the only solution requiring his needs.
I'm willing to learn more: if there is a solution that I could implement in one month or two, I will do this and learn what is needed, but can't learn PHP in two months.
Any advice?
You might find that CushyCMS does what you want. From the site:
Allow clients to safely edit content
No software to install, no programming required
Takes just a few minutes to setup
Define exactly which parts of the page can be changed
Produces standards compliant, search engine friendly content
From experience, a couple of downsides:
No choice of editor
You have to add pages that can be edited - the client cannot create new pages.

Generating a static website from a set of content data (possibly with webgen, webby or a similar toolkit)

My company (an engineering firm) is looking to redesign their website with some dynamic content. We have a nice portfolio of projects that we'd like to present on our site by category.
To elaborate, I'd like to have a "Projects Category" menu, where you can choose a sub-project category (such as churches, schools, etc) which links to a page with images of all projects which have been tagged with that category attribute. Clicking on an image would then take you to a detailed page for that project.
I have done a good bit of asp and jsp page development, but I've always worked on the front end in an enterprise environment - I've never built a production site from the back end. The advice I've gotten so far is that a full-blown CMS solution would be somewhat overkill, as we won't have a large hit count, and we'll be displaying a few hundred projects at most.
One big-picture choice I appear to have - whether to dynamically generate the pages (with asp or jsp) or to use a tool to generate a set of static html pages. The tool would build the menus, project summary pages, and individual project pages based on a set of data I could provide (in the form of a database or text file.)
I'm leaning towards trying to use a tool like webgen or webby to statically generate the site due to our current web hosting situation. Any thoughts on which approach is more appropriate? Is webgen or webby capable of doing what I am trying to do? Or can anyone recommend other web authoring tools better equipped to accomplish this?
Thanks for any feedback!
You could always use Template Toolkit :)
Jekyll may be worth a look.
Refer: https://github.com/jekyll/jekyll/wiki/
I've been told that webgen can't do what I'm trying to do (without some manual coding extensions myself) but that nanoc can.
http://nanoc.stoneship.org/

What's the best way for my client to add pictures to website

I am working with an artist to make her personal website. She would like to sell her artwork from the website. The issue is, she would like to be able to add, remove and price the artwork herself. She would also like to use paypal as the payment method.
Obviously design and coding is easy for me, that's all static. I am not sure however, what the best method would be to set up a way for her to add artwork herself.
I know there are some open source e-commerce sites (magento, zencart ect.) but I have never used these and feel they might be a bit overkill for a simple art site. Is there something else really simple I should use?
Any general thoughts or suggestions are greatly appreciated.
Thanks!
Use a ecommerce site, its the obvious choice if she wants to sell stuff.
Zencart isn't as overkill as you think - it allows you to remove all the bits you don't want from the site using its admin gui; so you keep just the categories and the cart sections.
It also has options (IIRC, but I may be thinking of a different one, like CRELoaded) that provide for pay-and-download links.
Certainly, reusing ecommerce code will be a lot easier than writing your own.
Always use an existing framework for commercial sites. It's just too easy to make a silly mistake which allows hackers to take over control of the server.
I recently found a really cool (and free) method of using php and javascript to upload, resize thumbnails, and display all uploaded content from the folder.
Taking this code from a free tutorial and pairing it with a customized javascript gallery looks really slick (used it for my own photography site as well as a few clients who loved it).
Very soon I will be combining it with a site for a historical golf course architect... a gentleman has come to me with hundreds of pictures he would like to store on the web, but he wants the capability to upload himself at any time. The trick is this: If your client artist wants to price it herself, the gallery use would require her to be able to navigate the basic html framework enough to change the descriptions which appear beneath all of the pictures as she adds/changes them.
If you want to get started on your own check out some of the tutorials here:
http://net.tutsplus.com/category/videos/screencasts/page/3/
as well as finding a gallery that you both like for displaying the photos in an attractive way... Let me know if you want anything else from me :)
Why don't you create a simple administration panel where s/he can add, remove and price the artwork? Do you know any programming languages? PHP?
Virtuemart is based Joomla CMS , very easy to set up, an Open Source eCommerce solution. You might find a lot of free extensions of Joomla for photo gallery and other things.
Gallery2 is an excellent web-gallery software, suitable for presenting images, videos, and audio.
It has a "CheckOut with PayPal" plugin.
Gallery2 will require some time to configure, it is unlikely that you will use it "as is" after install.
Gallery2 is easily embeddable - provided minimal PHP skills, and good HTML/CSS skills, one can make it fit inside any design (maybe except for the grid-like thumbnails layout, which I guess is possible but harder than average).