We are developing a CMS and would like advice on the best way to handle user customizable themes. We have a couple ideas but are not really sure what the best approach is. The CMS will allow the user to customize every part of the site including colors, fonts, layout, etc, through a theme editor UI built into the CMS.
We were thinking writing a custom CSS parser that writes changes out to a CSS file for that theme. This approach seems like it may have a lot of point of failure and a lot of overheard.
The other way was to store all the CSS in a database and then just use inline CSS.
The CMS has been built using JQuery and PHP with MySQL database for user information and content, but not CSS.
Is there a more efficient way to parse/control/edit CSS properties of the theme?
Thanks
My suggestion is to take a look at the way WordPress or any other pre-built platform (Drupal, Joomla, etc.) approaches this. WordPress themes consist of template files stored on the file system that allow users to have complete control over the look and feel of their Web site. The CSS for each theme is stored in a file called style.css. WP itself does not enforce a frontend layout but instead leaves that in the hands of the site administrator/developer.
I would treat your CSS files as if they were code classes. For instance, have a CSS file for your customizable font themes, one for page themes etc.
With that in mind, on page load you can easily build a dynamic CSS file based on user selections.
AKA
font1.css
font2.css
font3.css
page1.css
page2.css
page3.css
On Page load you identify that user preferences are font 1 and page 2, pull in both css files and walla you're good to go!
I am currently looking to do the same thing. Some of the solutions I've come across seem to use an xml file for the layout and then (probably) parse out a custom css file. This way, the layout determines the "stacking order" of page content modules and the other customizable features (which are usually limited) such as fonts, colors & background image are handled by an additional custom (user)css file.
I'll be following this one and will also be interested in finding actual code solutions to making it happen. For instance how to use jquery to build a draggable content module interface for the user backend.
Related
I am working on a landing page using HTML, CSS , and JavaScript which are the tolls I am familiar with, but the client informed me that he want a dashboard to update the contents , images ...etc . I am not familiar with WordPress and have not done any project before. So is there any way to create the website then convert it into WP or any other way to solve the issue I am facing ?
hope I found a solution here
Yes you can create the HTML first. Then you can convert it to a WordPress Theme. But would require some PHP coding and knowledge in WordPress template structure, functions, etc.
Or else, you can hire a developer for this purpose.
Or the more easier way for you would be to use a drag and drop content creation plugin like Elementor (personally, I like it more) or WPBakery or something else.
EDIT:
To answer your question in comment, there's a starter theme called Hello. You can use it as your canvas and start adding your components and layouts in it. There are many third party Elementor addons available for use (some are premium). I mean certain elements for your layout would already be there as an addon widget created by someone else or it might be already shipped with the Elementor plugin!
If you have some time to spare (I mean it's not an urgent project), I would suggest some time playing with it.
I am a developer who has never used wordPress before and just had a couple of questions about creating a custom theme
To create a specific look to a website do I create a static design then inter grate it with wordpress and add the dynamic content where it needs to be added?
If you create a custom theme how do you make it dynamic rather then being static? When I switch themes I loose the all the appearance menu options such as (menu, widget, header and background) How do i create them?
For stuff like image carousels if I want the images to be dynamic do I create a widget for it in the functions.php file?
For all the text on the page do I just spit that out thru the visual editor? seems to break links when editing
What are starter themes?
Sorry I am quite new to Wordpress but have knowledge in html, css, js and php but I just struggle to understand how to integrate a custom design and make it all dynamic
As a first step to create a basic new template I would recommend you starting with one of the default WP themes (e.g. Twenty Fifteen), leave all the core files (they contain dynamic parts e.g. functions loading header/footer/content) and just customize the css files and images. Further customization would require changing code in php files (e.g. header.php for the header, index.php for the homepage, single.php for the article page, etc.)
It is true that some options related to header, background, etc. can be theme dependant, so when you change it the configuration gets lost, but the others like menus and widgets remain like they are when switching themes.
Yes, for stuff like carousels you usually have to use custom widgets and plugins, you can find some really good ones on the web (e.g. this one), so you just upload the images and apply configuration in the backend.
Yes you use the WordPress editor (as you see it has Visual and HTML view) for all the user content within the pages and posts. Broken links might be cause of using relative paths, just make sure they are complete.
As mentioned in the first point you can always start with the default WordPress themes like Twenty Thirteen, Twenty Fourteeen, Twenty Fifteen etc.
I am working on moving a normal HTML website to Wordpress for a client. It's a simple website with a lots of images and HTML text. The idea is that client should be able to modify contents of website through the simple CMS without actually looking into code.
While doing analysis I came across some roadblocks like
Problem: If I want to modify text/ image for Header or footer in wordpress, I will need to do it in PHP code.
Solution: Create a customized header/ footer update tab. Modify database to store these contents and modify PHP code to directly read the data from database.
Problem: Wordpress provides a set of widgets (blogrolls catergories etc.), I need more like Latest News.
Solution: Modify PHP code and datbase, basically create your own widget.
Problem: There are a lot of static HTML pages which are linked from one page to another.
Solution: I don't see any way in wordpress to create static HTML pages which among which we can create links from one to another.
Solution: Create a new interface where user can create HTML pages/ plain text content. This will return a link which can be used to provide hyperlinks in another page.
My query is: Are the solutions mentioned above correct? The problems mentioned look very common, so is there a tried and tested way to solve?
Edit: User (Client) want to use wordpress. Just wanted to make sure here that Solutions I am thinking about are correct. So would like to have suggestion from someone who has already worked on Wordpress and solved the problems like I have mentioned. Do not want to reinvent the wheel.
I've worked a lot on a Wordpress-base white-label CMS, so I think I can help you in some ways.
First of all : always remember the real power of Wordpress is its community and its plugins base (that you can access directly from wordpress admin)
Problem: If I want to modify text/ image for Header or footer in
wordpress, I will need to do it in PHP code. Solution: Create a
customized header/ footer update tab. Modify database to store these
contents and modify PHP code to directly read the data from database.
If you want to have a fully customisable appearance, I suggest you to start from a theme like Consctructor. This is a theme with a whole admin panel for simple appearance editing. The code is far from perfect but this is a good start.
If you just want to manage the content of header / footer, you can do it via Menus / Widgets / Links, but only if your theme is designed for that. For example, a lot of good theme allow you to add widgets in footer, then you can construct your footer with only a few drag-n-drop in the Appearance/Widget menu. For header image, the default theme (Twenty-Twelve) provide an header panel where you can upload a new image.
Problem: Wordpress provides a set of widgets (blogrolls catergories
etc.), I need more like Latest News. Solution: Modify PHP code and
datbase, basically create your own widget.
Yes you can create your own widgets for specific needs, but I suggest you always start from an existing one. There is a lot of plugins providing you dozens of widgets. Explore that before reinventing the wheel.
For your specific case, a 1s google-search returns me this plugin.
Problem: There are a lot of static HTML pages which are linked from
one page to another. Solution: I don't see any way in wordpress to
create static HTML pages which among which we can create links from
one to another. Solution: Create a new interface where user can create
HTML pages/ plain text content. This will return a link which can be
used to provide hyperlinks in another page.
No, use the pages. Wordpress Pages are static content and this is editable, and for each page ou have a permalink. If Pages aren't good for your job, you can consider creating a custom type (or install a plugin that create a custom type).
Wordpress themes can be made to accept images and stuff like that.
The are ample wordpress widgets to do just that. Just be sure to find the right one.
I don't understand this one. You can create any amount of wordpress pages, and to link between them is easy. If you want your files to end in .html, simply enable permalinks and specify that option. It's very easy.
Reinventing the wheel sometimes is good, possibly even good for you (Given patience and time). Nothing is prepackaged to do everything for you, hence these are times when you need a custom build.
Anyways, CMSes don't come as a multipurpose, all-in-one package that solves your programming woes and turns everything into a point-and-click solution. Every CMS is unique, designed to serve a specific purpose. Others general purpose, others for blogs, others for very simple sites.
If you don't find anything native that fits your needs, find the right plugin for the job. If you cannot find anything at all, then might as well build a custom solution, or build on top of an existing resource. Innovate
I am in a critical condition. I was paying a developer in India who left the project but now I need to access the php pages.
I have explored the joomla site using the admin login but i can't find how he is displaying the html/php pages.
Please help!
I assume you're looking for the front-end template for the website.
Using FTP or whatever control panel go to the Joomla folder, look for a folder called templates - it should be one of the folders in there.
To check what the name of the current template is, go to the admin panel and look in the template menu.
If your developer has also made any custom components, the front-end part would be somewhere in the components folder, and the backend bit would be in administrator->components.
You need to read some Joomla tutorials. There are many places that can be used to "display the html/php".
First you have the template files that determine how the site looks and what module positions are available to be used. Generally there is one template in use but there can be multiples.
Next you will have components where the content is entered. At a minimum it is likely that you are using the com_content (articles/categories) and it is very likely there are others being used.
You will also have various modules that will display content in areas outside of the main content area. This will generally include menus, login forms, and other similar content.
Last, plugins can also have an effect on the content. In some cases plugins inject content and in others they replace placeholders with content.
There are a lot of pieces to the puzzle that all come together to display the resulting web page, it's not just a simple question of accessing some files.
After some solid advice from people on here about using WordPress for a small (six page) website, I wanted to broach another question regarding using WordPress for a non-blogging site. Yet, I know my client would like to update various, but small portions of their site from time-to-time.
I won't be installing WP in the root, but a sub-directory and have all my core site files sitting in the root.
Here are my questions:
Can I include content from Pages in WordPress and output that content on any page outside of the WP install directory? Is there something specific I would need to include?
Do I have to use a Theme or can I still use my already built CSS?
I'd like to be able to use my own CSS for the site and not have it be tied to a Theme - is that possible? Meaning I use www.example.com/css/styles.css vs www.example.com/wp-content/themes/styles.css.
I also have a slider comprised of three DIVs for each panel, can I pull in that specific Page with that markup for the slider?
Can I also make my own queries for data as well?
Is there anything that I won't be able to accomplish or advise against doing?
I'm mostly concerned about having to use a Theme, mostly because I don't know if I'll need to use it or not.
Thanks for any help.
Lots of docs available:
http://codex.wordpress.org/Moving_WordPress#Giving_WordPress_its_Own_Directory_While_Leaving_the_WordPress_Index_File_in_the_Root_Directory
and
http://codex.wordpress.org/Integrating_WordPress_with_Your_Website , where you pull pages/posts from the WP loop into your existing design, CSS, etc.
You will need to link necessary JS files in the site.
http://codex.wordpress.org/Function_Reference/query_posts will show you how to make your own queries.