I have an issue. I have made a custom website using CSS and HTML. I want to allow my client to edit and add posts to the website without any knowledge of HTML or CSS while still giving myself the ability to manage the code. Is there any programs or online tools?
I have tried wordpress at (Wordpress.org) and set it up on my website but I was unable to figure out how to use my custom HTML and CSS on the wordpress.
You can create custom sites in Wordpress by using the default installation (I think currently it's the "TwentyTwelve theme), and simply copying the files you want to customize into a child theme directory - named anything you want.
Also copy the default CSS into the child theme directory you make. These files will then be what supercedes the default files when you choose yuor child theme in the Appearance > Themes menu in the default dashboard.
Related
I want to use a SVG logo in my woocommerce storefront theme. I can't use the Customizer b/c it won't allow SVG uploads. Is there a way around that restriction?
If not, how would I edit the hook/action to use the SVG?
I see the storefront_site_branding template function in the storefront/inc folder and I tried creating an inc folder in the child theme but apparently the override does not work on files within the inc folder.
If you are using a child-theme you can add this to your functions.php, if you update you themes functions.php it may override during your next patch/update.
I sourced this code from:
https://themeisle.com/blog/add-svg-to-wordpress/
Method 1: Use the SVG Support plugin
If you’re looking for the fastest way to add SVG to WordPress, this is it. We’re going to use the SVG Support plugin, which enables this particular image format and adds support for it to your media library:
The process is simple. You just need to install and activate the plugin as usual, and then you’ll be able to add SVGs to your WordPress site.
WordPress now requires us to have the tag in our SVG files before uploading. Please open your SVG file in any code editor (such as sublime text) and add the following to the very first line of your SVG file and save, so that you don’t encounter security errors:
<?xml version="1.0" encoding="utf-8"?>
However, there are two more settings you might want to change depending on your needs. First off, let’s go to the Settings → SVG Support tab:
How to add SVG to WordPress using SVG Support plugin
Inside, you’ll find two options. The first turns on the plugin’s Advanced Mode, which lets you target your SVGs with CSS. If you don’t want to animate your SVGs, then you can skip this option.
Second, you can also restrict the ability to upload SVGs to administrators only by enabling the Restrict to Administrators? feature. That one’s up to you!
Method 2: Modify your site’s functions.php file
Every WordPress website has its own functions.php file. This essential component includes important functions, classes, and filters. It’s also your ticket to adding SVG support to WordPress through a few lines of code.
To reach this file, you’ll need to access your website via FTP. If you don’t have a client, we recommend using FileZilla. Once you’ve found your FTP credentials and accessed your site, you’ll want to head to your root folder, which is usually either called public_html or named after your site:
The WordPress root folder.
Now, enter the wp-includes folder and look for the functions.php file within. It’s important to note that this is the parent file, while there are also individual functions.php files for each of your themes:
The wp-includes folder.
For this example, we’ll add the code to the parent file. However, you may find the changes are lost when WordPress is updated, so feel free to alternatively add it to your theme-specific functions.php file depending on the approach you’re more comfortable with.
(Editor’s note: Doing this in your theme’s functions file is actually the recommended approach.)
Access the functions.php file now by right-clicking on it and choosing the View/Edit option. This will open it using your default text editor. Now, scroll to the bottom and paste this code snippet there:
function add_file_types_to_uploads($file_types){
$new_filetypes = array();
$new_filetypes['svg'] = 'image/svg+xml';
$file_types = array_merge($file_types, $new_filetypes );
return $file_types;
}
add_filter('upload_mimes', 'add_file_types_to_uploads');
I am new to wordpress development. I was wondering if I am able to combine an existing wordpress theme that I currently have on my website with an html template that I found through themeforest. Would I need to create an entirely new wordpress theme for this? Or could I just import the css files of the html theme and use the html elements accordingly?
Thanks!
You can edit your wordpress theme according to your desire by creating a child theme. See this link child theme
You can modify the theme according to your desire but you cant just copy paste any html template to wordpress and expect it to work.
I just started learning MEAN JS and I am trying to find the html file for the main page. However I only see home.client.view.html and header.clinet.view.html in the view folder.
From what I know is, usually there is a main html which holds all the information of the home page, and we can add links of CSS files and JS files in the main html file.
How can I add links of extra CSS files and JS files in MEAN JS since i cannot find the main html file?
The MEANJS top level page is located under server/app/views/layout.server.view.html and is where you set header meta tags. Most everthing else on the page is programmatically inserted by angular, such as links to CSS files and Javascript files.
Any of the CSS or Javascripts files under your server/public directly are automagically added to the page. If you wish to add other, third-party scripts or stylesheets, you do so by editing your server configuration file, located at config/env/all.js.
So for example, to add the angular version of the tinymce editor to your MEANJS site, you'd edit config/env/all.js by adding CSS to module.exports.assets.lib.css and references to the tinymce editor and its angular wrapper to module.exports.assets.lib.js.
You will need to restart your server (via the 'grunt' command) if you change this file while the server is running.
UPDATE
Using mean-cli#0.6.1 to scaffold a new mean project, the default "top-level" page is located under packages/custom/meanStarter/public/views/system where you will find two files:
header.html - which describes the layout of the default navbar
index.html - which lays out the content of the default page
Now, having said that, it should be noted that the "proper" way of configuring a mean server to display your own top-level homepage is to create a new mean package.
See the docs for further information.
I just installed magento onto a server, and previous to that made a website layout ( basic html website) which i'm aiming to implement as a main layout on the magento site.
I'm new to Magento, and i've tried working with custom wordpress layout with the use of css. Yet this project gives me the assignment to use the html/css layout and change if not delete the default magento template. I Have no idea how to even get started at this.
Can anyone give me some pinpointers? if not just a link to a tutorial.
The idea is the use the layout i made and use it as a template, but with the goal of using Magento's e-shop functionalities.
thank you.
Philip
Magento has a Design folder and a Skin folder to customize your front-end.
File hierarchy
If you set up the folder structure of your custom theme correctly, Magento will only use the files you overwrite in the new theme. If you go to Magento>app>design>frontend you will see a "base" and "default" folder, base is the uppermost folder in this hierarchy.
Design (html + xml layout)
If you want to create a new theme you start with creating a new folder in Magento>app>design>frontend and copy the files you want to change in your theme. So if your theme will change the 1column layout to start with, you'll end up with this:
Magento>app>design>frontend>[YOUR FOLDER]>default>template>page>1column.phtml
Skin (images + css)
Same goes for the Skin folder. When you want to change the main css file for your theme you'll end up with this structure:
Magento>skin>frontend>[YOUR FOLDER]>default>css>styles.css
Setting Current Package
In the Admin panel you will have to go to System>Configuration>Design>Package and set the "Current Package Name" to the name of [YOUR FOLDER].
Manage Stores
You might want to add a store view, store or website to be able to change views so you could for example show a different front-end for different countries or special offers. Make sure you set the package name to the right scope, in this case.
I want to use custom css/js. I have moved these to the server. But the drupal page starts with a section. how do I add the custom css/js to my drupal site page. I have admin and just need to know what to do to get this included on the page. Please send exact steps as I am totally new to drupal. Thanks
"Custom CSS and JavaScript files" module allows to specify two folders, one for CSS and one for JS where the stylesheets and javascripts files are located respectively.
The module creates two sub-folders under your files folder:
files/customcssjs/css
files/customcssjs/js
Indeed, it's depend on your task, what css and js files should do, and adding these in custom module (drupal_add_js, drupal_add_css) or custom theme (info file, preprocess in template.php or directly in page-XXX.tpl.php and so on).