I am actually trying to integrate my static HTML pages with TWENTY TWELVE theme
As far as I understood, I need to add my header section into header.php and footer to footer.php and for the content part I need to add template and for adding CSS & JS function call need to add them function.php
But after doing all this things my CSS classes does not get applied to HTML code which I have added to header section as well as footer section.
After inspecting I came to know my CSS classes are loaded properly but does not get applied.
Related
Not sure if this is only problem for Elementor full width template, but it seems to override theme header.php. I tried achieving my goal by using elementor custom code feature, but it adds my code somewhere in middle of the tag.
What is the propper way of adding my own custom code as the first thing that is after the element?
You are right Elementor overrides the theme's header.php file so importing your code to this file is not effective. You need to add custom function to earn your goal. With the wp-head action you could add the code right into your header and Elementor will not override it.
Add this code to the functions.php file od your active theme.
add_action('wp_head', 'custom_head_function');
function custom_head_function(){
?>
YOUR HEADER CODE HERE
<?php
};
UPDATE - If you want to set your code at the top
As sephsekla mentioned in comment, there is a way to set the priority into your action to get it to the top. Try to set value to -999. So, choose a very low number and if there is no other lower number in your plugin or theme you will go straight to the top.
add_action('wp_head', 'custom_head_function', -999);
function custom_head_function(){
?>
YOUR HEADER CODE HERE
<?php
};
Elementor now supports custom code (javascript, html, etc) and supports the specific use of elements in the head of the page.
What you are looking for you can find at the Wordpress Dashboard> Elementor > Custom Code . Then you will be able to add a custom code to the head: https://elementor.com/help/custom-code-pro/
I want to change some particular line on my Wordpress site which I cannot change in the customization. How do I locate a certain line with inspect element in chrome?
My website is www.Artiana.io and I want to edit this line:
"<h5 class="subscribe-description">Learn more</h5>"
Please, can anyone help me out?
Let me show you how you can use WordPress's hints in html body class to find the php file:
WordPress gives hint in the HTML's body tag that which particular template was used to display this page.
In your case we have following classes in the body tag:
<body class="home page-template page-template-page-templates page-template-page_front-page page-template-page-templatespage_front-page-php page page-id-466 custom-background wp-custom-logo blog-post">
Now there is a specific class which ends with php, which tells that template was used by your theme to build this page. i.e. page-template-page-templatespage_front-page-php
Now it could mean that in your theme folder:
/wp-content/themes/hestia/
There could be sub folder or folders called: **page-template/page-templates** and inside it is page_front-page.php PHP file, which is being used to create this layout. See if you can locate the code you are trying to modify there.
I'm trying to customize the framework.css for how high or low the sidebar appears on specific pages. Would it be possible to do this using a custom page template and a specific div class declaration? Such as creating a custom template and within that template creating a class to "override" the default css sidebar element settings for those pages? How would I go about doing this?
One option is to make sure the theme is using the function body_class() inside the <body> tag.
When I select the page template Sidebar Template (wp-content/themes/twenty-eleven/sidebar-page.php), the class page-template-sidebar-page-php shows up in the body tag:
According to brasofilo's answer, every page has its own class, in case of brasofilo's code, it is the page-id-674. It's generated by wordpress in general.
If you want to do styling on specific pages, you may use something like this:
body.page-id-674 div.specific-div-class {
/*code*/
}
Hope that helps!
i'm using the twentytwelve theme and i have to write custom content into my example template.
I want to maintain my header content so the main structure is the following
header = id page, wrapper
ex.page = primary, content
footer = close wrapper, close id page
If i have understood correctly, if i want to insert content into the middle of my page i have to do it into my template page (that is a copy of the main page.php), that is in the middle between my header and my footer
For example i want to insert a div into which insert the loop of such category.
The problem is that it displays me nothing, like i've wrote nothing. I can only see the contents if i erase all the originary div, but it's not what i want to do, just because the only div is the page which is my container.
I can't catch what i have to do.
Can you tell me what i forgot to do?
Thanks,
Alex
page.php is a "master" document. header.php, footer.php and (if it exists) sidebar.php are all imported into page.php. Twenty Twelve also uses atomized content templates. You may need to add your div to content-page.php, which is also imported into page.php. content-page.php is used inside the wordpress loop, and encapsulates the code that pulls in the actual article elements from the wordpress database.
If you are trying to add straight HTML to the templates, ensure that you are not adding code between the php brackets:
<?php // don't add html here ?>
<div>do add html here</div>
Depending upon the type of wordpress page you are trying to display, you may need to consult the Wordpress Template hierarchy to determine the proper Wordpress naming convention for your template file (the copy of page.php).
Technically speaking, everything in content-page.php can be put into page.php replacing the get_template_part function. All the 'content' pages are totally not required and can be combined into one file if you want simplicity.
In my opinion, it's easier to start from scratch when learning Wordpress rather than try and re-work something. The default wordpress themes don't lend themselves to be beginner friendly.
Where do I place things like header's image, background color, background image...? Should I simply add them to html code? Or add pieces of the CSS to functions.php?
Also, when I add some code to head section from functions.php - will this be loaded automatically, or should I add something more to the head section myself?
you can change style.css for any css change
and header.php for header section,footer.php for footer section
for home content index.php file
you can call function from function.php file in to these files
If the theme you are using already has the HTML, then just modify the style.css. If the theme doesn't support the image placements that you want, you can either try to modify the HTML files yourself, or ask the theme creator to add it for you. If you modify this yourself, you'll have to remember that future updates to the theme may overwrite your changes.
If you are creating your own theme and don't care about flexibility, then add a spot in the HTML using your tags.