How do i convert sparkle visual designed html page along with css and javascript file to wordpress inorder to make a wordpress template?

Hi guys! Can you help me out i want to convert sparkle designed html page to wordpress theme. I want to upload to the wordpress site . I am unable to import my custom design theme to the wordpress site as wordpress interacts database server with PHP. I tried creating php file on sublime text and followed the procedures but still it is very daunting and confusing . Is there any convenient and easy approach of doing it?

@goneraone619, O Wow what a feat!

I had a client who was adamant on a WP so I thought to try converting a Sparkle file in a similar way.
There are a few things to keep in mind…

  • the created template is hooked into a database
  • Sparkle creates fixed width breakpoints while WP is geared towards fluid width breakpoints

So in looking to try and achieve this I found an application that Pinegow offers - https://pinegrow.com/theme-converter-for-wordpress

Let us know how you go…

Thanks a lot. This is what i was looking for. This will do the job for me. Cheers!!!

Let me know how you go? It would be interesting to know… Thanks! :slight_smile:

@greenskin, on importing Sparkle designed folder to Pinegrow, from there on Pinegrow converting Sparkle designed folder to wordpress theme is happening successfully but after exporting the wordpress file to the system and upload zip file on wordpress and after applying images dont load up, on conversion i dont see only the images .I am not sure why Pinegrow is not able to detect any Sparkle export images on preview or on upload to the wordpress wp-theme folder. On importing sparkle designed folder , the design loads on Pinegrow with no problem but actual problem starts after preview and after exporting. Not a single image is visible.

@goneraone619, I’m sorry I never went that far so I don’t think I can help you further.

Have you uploaded the images to WordPress separately? I believe the images needs to be in the database and then placed into the Sparkle theme in the WP CMS.

This is more of a pinegrow problem than a sparkle problem though. Many HTML editors bank on the false promise that they can be fully visual and also give access to code. This is simply not possible, and you have the demonstration there.

@duncan Yeah, you are right i tried several times but somehow Pinegrow does not detect images after conversion specially importing saved folder from Sparkle. It is upsetting for those who wants convert custom design html to own wordpress theme or for those who want convert their custom HTML file to PHP.

Can suggest any other method i can convert HTML file to php without code?

You are asking the equivalent of “how do I make water not wet”. There’s no answer that doesn’t get into the kind of detail you are trying to avoid, because PHP quite literally means coding, and Wordpress is just not PHP, it’s also specific coding and a specific setup.

And after all that effort what you achieve is a website that has performance and security issues.

2 Likes

Wordpress is a CMS (Content Management System) of small templates assembled together to create a large template that ends up being a website. Its functionality is handle by plugins and modules. Its responsiveness is controlled by a framework called “Bootstrap”.

You have to create all the folders, by hand, that contain the website assets. You have to then go into the PHP editor to create actual files, by hand. You have to upload all your content, properly sized and formatted by you. Finally you polish the website to a nice shine with CSS, again coded by hand.

Pinegrow attempts to mimic these steps. But it forces you to start with a Pinegrow template, based on the rigid Bootstrap framework, not a freestyle design. This is the main reason all Wordpress websites look the same. Then using a combination of modules and CSS (you need to understand CSS) you build a webpage. To make this work you have to use Pinegrow’s web editor, not Sparkle.

The difference between building and custom design is the difference between Wordpress/Pinegrow and Sparkle.

The questions to ask yourself are why do you want to build a Wordpress theme? What is your skill set? If this is a onetime endeavor then use Pinegrow to get the best result you can. If you want to sell your theme, hire the skills you don’t have (If you design, hire coding).

@thetravelhikelife, A very thorough take on it all which makes total sense!
Thank you for sharing! :slight_smile: