Revisiting The Development Of My HTML/PHP Template Designed For A Shoe Manufacturing Firm

View this thread on: d.buzz | hive.blog | peakd.com | ecency.com
·@akintunde·
0.000 HBD
Revisiting The Development Of My HTML/PHP Template Designed For A Shoe Manufacturing Firm
Before writing anything on this project, let me first present a proof of work as I have a different username on github (akintunde102). So below  is a logged in section as proof of work with the blue encircled section showing me logged in  as AKINTUNDE102
 ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512827477/tcualhgixzropa4yhujw.png)

Below are snapshots of diffrent code contributions that I have made to the  project owing to the fact that I have been the only contributor .

![order.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512828675/r63mfgd7zpfusxpl6ysl.jpg)
The Order Page (code)

![index.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512828675/omc5ovgufcfv4wyuw7x4.jpg)
The Index Page (code)

![product.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512828675/e6o4h70faghktaww6xha.jpg)
The Product Page (code)

Ever since I discovered the mission of UTOPIAN.IO,  it had been like a dream come true, to be able bring to limelight many of the projects that I have done over the years by uploading them on github and talking about them here on UTOPIAN-IO. 

I actually uploaded this html template to github about a year ago , ever since, it had only been been me that actually knew about the project but today, I hope to revisit the beauty, minimalism and simplicity of this template and talk about how it can used.

It is server-driven, so it is not entirely an HTML template, it has some php in it for file  inclusion and mailing. 

Like I said in one of my posts, I like writing my own libraries when elaborate codes are not needed. So everything was coded and designed by me , except for bootstrap and maybe jquery that I just love working with.

This template is called the Shoe Template and it was intended for a show manufacturing medium scale enterprise.

 The template is  more of ahowcase platform rather than a shopping platform, with goods that can only be ordered by email contact and not direct purchase. There are businesses that needs that kind of Web Development Project. Who knows? An UTOPIAN could need this.

*One more thing* , while downloading  this file,make sure you read the readme  file for instructions on installation.

The htaccess codes solves quite some simple problems that beginner web designer meets while trying to transfer their work from development environment to production enevironment. 

Have you ever tried to upload a project that worked perfectly on your local server  to a web host and the next thing you see,  is that the website just goes blank, you call the customer care and they are like “This errors seems to be from you”.

Well, I have been is such situations and it’s always my fault. Nevertheless, I hope I will be able to, one day, give a tutorial on  the intricacies of htaccess. 

Every seasoned web developer knows that the majority of unexplanable weird problems can be solved by just tweaking the htaccess. 

Nevertheless, I am just trying to say that you should read the readme file of this project , there are some instructions for htaccess there. 

## So, the Analysis:

### Index Page:
This is a zoomed out view of the front page of the index page:
![a1.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512756162/cfqgvj0ei18gbmsez9rj.jpg)


And this is a screenshot of the code of the index page from notepad++:

![a2.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512757111/uvmaz6j86np78oxbkrga.jpg)


I could only snap a certain portion of the code because of the length, nevertheless , you can see the rest of the code on the github page [https://github.com/Akintunde102/TheShoeTemplate ]

This is the lower part of the Zoomed Page of the index page featuring some dummy shoes. As you can see , the template is for a  shoe manufacturing company.


![a3.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512757133/lpfscyjjj9gfhwhyx5ju.jpg)


### CONTACT-US AND ABOUT-US
Now there are certain dynamics on the front page that are unusual, they include the way  the ABOUT US and CONTACT US don’t take you to the next page but rather gives you a popup, that saves  the server some bandwidth and the user , stress and time.
Here Is a  snapshot of the popups for both pages:

![a4.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512757163/zxlgcxlrkqqobm25ltey.jpg)

*ABOUT US PAGE:*

![a6.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512757183/bqe4onx3ht6eeg1atafy.jpg)

*CONTACT US PAGE*

I am so happy with this feature because it saves the user a lot of time to reach to the manufacturer and order.

### SHOP PAGE
Then if you click the **Shop Page**, there is a list of different dummy shoes that has an ORDER/ENLARGE  hover button which when clicked brings  a form page to contact the seller. That was how the seller wanted it, he wanted to be contacted first:

![a9.JPG](https://res.cloudinary.com/hpiynhbhq/image/upload/v1512757207/osvblxnvvwl991b9islo.jpg)


There is actually more to the whole page and I know it seems quite behind and outdated in comparison with today’s design standard but believe, it's a piece of art. I think Web Design is a form of art. Don't mind me!

Nevertheless, there are snippets of code here and there that could be useful for you. Moreover, now that it’s on github, it’s no longer mine alone, it’s yours too. Do whatever you want with it  and I actually attached the “Don’t be a Prick License to it” which gives you a hell lot of freedom on how you can use.

Thank you UTOPIAN-IO, thank you my followers .

More and better is to come .







<br /><hr/><em>Posted on <a href="https://utopian.io/utopian-io/@akintunde/revisiting-the-development-of-my-html-php-template-designed-for-a-shoe-manufacturing-firm">Utopian.io -  Rewarding Open Source Contributors</a></em><hr/>
👍 , , , , , , , , , , , , , , , , , ,