Support » Everything else WordPress » Converting to WordPress

  • Resolved SturmB

    (@sturmb)


    Good morning.

    TL;DR:
    I’m looking for the best way to replicate the appearance of an old “static HTML” site (americanaccents.com) into a modern, data-driven WordPress site. What is the best way to do so?

    The long story:
    Every year, we have to update it by hand, which takes late nights, early mornings, and weekends during the last few weeks of the calendar year. Needless to say, editing a static HTML site is excruciating, but our boss wants it to look “exactly like the paper catalog.” That catalog is in a horizontal format, like a car dealership’s brochure for a new car, with glossy black pages and all. Thus, our site looks like something out of 1998.

    I hate it and want to convert it to WordPress so that future updates will be as seamless as possible, with product data retrieved from a database, minimizing typos and broken links, etc. In order to please the boss, however, it needs to look as close as possible to the existing static HTML site, but with responsiveness, of course.

    I have some experience with PHP and Laravel, know JavaScript well enough, and have even created an entire database from scratch that contains all of our product data, their specs, prices, etc. In fact, you can see my Laravel-driven site, which is essentially a d.b.a. of American Accents, at americancabin.com.

    On that site, everything is driven by the database and displayed dynamically. It’s also responsive. (I’m honestly surprised that our stuck-in-the-past boss allowed this site to go live.) Unfortunately, the American Accents site cannot look like this. It must be identical (or close to it) to the existing AA site.

    I’ve been told that this do-able and that I should use custom post types and/or custom fields. I’ve also been told to look into using Divi or Beaver Builder. I’m still relatively new to WordPress and I know I have a lot to learn, but I am certainly willing to do so, as I really want to get into the web dev industry. I even just finished watching Lynda’s course on the Advanced Custom Fields WP plugin, thinking that might also help me with this project.

    Please understand that I’m not necessarily looking for someone to build it for me; I just need to know:

    1. If this is even possible (converting the AA site to WordPress)
    2. What tools (plugins/themes/etc.) I should use to do so
    3. A rough outline of how I should leverage those tools to replicate the appearance of the existing AA site

    It would be ideal if I could also somehow import my custom-built product database into this WordPress version of the site, but I don’t expect that it would be possible. I wouldn’t mind too much recreating all of that data using WP’s tools (or plugins), though.

    So, I know this was lengthy, and for that, I apologize. I tend to be thorough and a little too prolific for my own good. Anyway, is there any chance that this project could be done, and how?

    • This topic was modified 4 months, 3 weeks ago by SturmB.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • I think you would do better to add CSS to your Laravel site than to try again with WordPress. (there are some issues with it as is, though, mostly the icons in the menu don’t show correctly, but I only looked at one page)

    You could easily import your data from your database into WordPress database. It would be easier than trying to get it all from static HTML again. You would need to choose plugins first and then see what format they use for their data. Or write your own plugin since you already have the data format and presentation.

    WordPress has standard tables for its data. Plugins can add more tables or use the standard ones. The posts table holds whatever the user types into the editor. Then plugins can add post meta (additional information specific to a post) which goes into the post meta table, but since it is a generic table that can hold anything, it is a little harder to access and a little slower than having a separate table for things like product specs.

    There is an old plugin that works fairly well, but you shouldn’t really need it since you already have a database.
    https://wordpress.org/plugins/import-html-pages/
    There is WP Scraper plugin.
    There is also https://importintoblog.com/

    Moderator bcworkz

    (@bcworkz)

    Just about anything is possible if you can code PHP, only limited by PHP’s capabilities, which are extensive. If you can code raw HTML well enough, you should stay away from page creation plugins like Beaver and Divi. They just get in the way IMO.

    The easiest way to replicate an old site is to copy the static HTML into page content, but then you inherit all the same problems with maintenance. A custom post type might be useful, but it may not be necessary, it depends on your data schema. What may be better is a custom page template that fetches DB data and outputs the desired HTML for the requested page.

    A custom fields plugin would make building a UI for managing the data easy, but how it stores data may not be optimal for your sort of data. Custom field data is typically stored in post meta by key names, which works well enough for many things, but can be a terrible organization if you will be frequently querying for specific data. In some cases a custom table is necessary for optimal queries. With a custom table, you can use any schema you deem best, but then you need to build your own UI to manage data.

    Assuming your need to query for individual fields is minimal and saving it all in post meta by key name is acceptable, here’s what I would suggest:

    Obtain a starter theme like “_s” (underscores). You can customize it in order to have the new site look just like the old one.

    Create a custom post type (CPT) for your data. Copy the theme’s single.php and archive.php and append your CPT name to the file name so the templates are used to display your CPT content. For example, if the CPT name is “foobar”, name the files single-foobar.php and archive-foobar.php. Customize the files as needed to properly display CPT content.

    Install and activate a custom fields plugin. Use it to define the fields you need to be editable for your CPT.

    If you have existing data in some sort of structured format like a spreadsheet or CSV file, you will need a custom one time script to import the data. To add data in a manner compatible with WP and custom fields, create an example post in WP, then study how it is saved using phpMyAdmin. Write a script to import following the same structure.

    Thank you for replying, @joyously and @bcworkz. That is some good, much-needed info.

    Okay, so I’m processing this information and beginning to see the ups and downs of using WordPress for the AA site. On the one hand, creating a Custom Post Type or Custom Page Template sounds like what I’d want to do. On the other hand, its data handling leaves a lot to be desired, from what I gather.

    Custom field data is typically stored in post meta by key names, which works well enough for many things, but can be a terrible organization if you will be frequently querying for specific data.

    Please define “frequently querying for specific data” for me since I’m not sure if our site would fall under that category. I suppose I could take a screenshot of my database’s visual diagram in PhpStorm, if that would help.

    I’m not opposed to creating my own Plug-in, but since I’ve no experience in doing so, it almost seems like re-inventing what I’ve already created with Laravel on the ACS site. I’m strongly considering going that route, since most of it is already created; it would just need to be styled properly. (Don’t ask me how to make those ugly, horizontal pricing and specification tables responsive; they probably just won’t be.)

    A custom fields plugin would make building a UI for managing the data easy, but how it stores data may not be optimal for your sort of data. […] With a custom table, you can use any schema you deem best, but then you need to build your own UI to manage data.

    As for an interface to make adding new products and prices each year, I’m sure that ACF (Advanced Custom Fields) or another custom fields plugin might be able to serve my needs, but again, I could just use Laravel Voyager to do something similar. I mean, it wouldn’t be pretty, but neither would custom fields, I imagine.

    That’s why I said

    I think you would do better to add CSS to your Laravel site than to try again with WordPress.

    Moderator bcworkz

    (@bcworkz)

    I’m inclined to agree with Joy.

    In any case, regarding frequent querying for meta data, if you need to make complex meta queries in order to get specific posts, perhaps due to some sort of drill down filtering UI, it’s not ideal. Especially when there is multiple meta criteria, or the matches should fall into a specific range of values, or the values to match lie within serialized array data. Such queries are not very efficient and may be better implemented through a custom table. If you just need all posts with a meta key of “foo” for example, and the related value should be “bar”, that’s no big deal. Pile on more criteria and the efficiency plummets.

    Yeah, along with the time that I’ve had to think about it, your arguments sound increasingly like I need to just abandon the idea of using WordPress for our sites. So I’ll stick with Laravel for now. Thank you both for giving me the information that I needed to help me to make my decision.

    Moderator bcworkz

    (@bcworkz)

    You’re welcome.

    keep away from http://importintoblog.com.
    These people are impostors. Not only their services do not work, but also they play stupid and NEVER REPLY when you ask for your money back, although they state that “All plans come with:
    A money-back guarantee
    If you are not thrilled with our service, we do not want your money. We will refund any payment made within the last thirty days if you are unsatisfied for any reason.” (https://importintoblog.com/sign-up)

Viewing 8 replies - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.