Just started learning WordPress, and I've run into a problem I can't figure out. I'm trying to use WP for the News section of my website. So I want to keep all my styles and structure, but add WP comments, archives, etc. The problem is that WP appears to be interpreting the DOM differently on the Archives page than on the homepage.
Here's what I intend the basic HTML structure to be with the WP elements added in:
<div id="wp-main">
<div class="news">
<div class="posts">
<p>POST CONTENT</p>
<div id="wp-comments>
<span>WP COMMENTS CONTENT</span>
</div><!-- #wp-comments -->
</div><!-- .posts -->
</div><!-- .news -->
</div><!-- #wp-main -->
.news has its opening tag in header.php, and closing tag before the footer in footer.php. .posts has its opening tag in content.php, and its closing tag after the comments in comments.php. This works great for the homepage:
But the archive page is producing nested .posts within the parent .posts, resulting in a russian-doll effect:
I know it's hard to pin-point a problem when you don't have access to all the code, but as you know, there's LOTS of it, so hopefully there is a wordpress expert out there, and I'm just making an obvious mistake :)
I figured it out, and I don't think anyone could've made this leap without much more information. In order to show the comments on the homepage I added this code to index.php (in the while loop):
$withcomments = "1";
comments_template();
Since my .posts ends AFTER the comments, I had to add that code to the while loop of archive.php as well. I didn't have the closing tag, since the comments weren't there.
Related
I need some help to understand how to create WordPress One Page Scroll website. I did a standard website before (the one that change content after clicking on menu link), but I can't figure out how to use WP on web page with scroll to section instead of standard sub-sites.
Let me show You structure of my site:
<!DOCTYPE html>
<head>
css/bootstrap
css/main.css
etc.
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top" id="navbar">
//This navbar overlaps header and it's fixed to top//
//Has links to sections (e.g. #one, #two etc.)//
</nav>
<header class="masthead">
//This is also my "front page" displayed on page load with height:
100%, width: 100%//
</header>
<section id="one" class="bg-primary">
//first section to scroll to//
</section>
<section id="two" class="bg-primary">
//second section to scroll to//
</section>
//first section to scroll to//
<section id="three" class="bg-primary">
//third section to scroll to//
</section>
<footer id="main-footer" class="bg-primary">
//Some info about author, website, and social media links//
</footer>
js/jquery.min.js
js/bootstrap.min.js
js/script.js //my custom scripts
</body>
My problem is- how to organize this content for CMS to change every section content via dashboard?
1. Should I create different page.php for each section (e.g. page-one.php etc) and use:
<?php get_header(); ?>
<?php get_template_part('page-offer'); ?>
<?php get_template_part('page-tech'); ?>
<?php get_template_part('page-portfolio'); ?>
<?php get_template_part('page-contact'); ?>
<?php get_footer(); ?>`
on index.php
Or should I create section-one.php, section-two.php etc. and display it on "front-page.php"?
My second question is- is it possible to create different PHP file with Navbar code, and use this navbars html, and css as WordPress dashboard menu? Or should I create menu in dashboard first (every section is a single page) and then style it with custom css?
And last: How to use custom fields to edit every single paragraph, button content, link etc. via dashboard and allow it to work with POLYLANG to change content language?
Thanks for any help, and apologize for long thread. I'm realy struggling with this.
Is there a way to only display a parent (wrapping) if it's actually been populated with content?
The reason I ask is in Wordpress I'm using Advanced Custom Fields to create additional text areas on the homepage of the website. The content is added to the page inside divs, like this:
<section class="band">
<div class="wrap">
<?php the_field('services'); ?>
</div>
</section>
If the field is left blank, obviously the markup that surrounds remains on the page and due to the margin/padding they have set on them it leaves a big empty stripe across the page.
I know little Wordpress (and PHP in general), I assume this must be possible? I've had a play around with if/else statements but had no luck.
Can anyone advise on this?
You could do it this way:
<?php if( get_field('services') ) : ?>
<section class="band">
<div class="wrap">
<?php the_field('services'); ?>
</div>
</section>
<?php endif; ?>
I tried to add a CTA to a WordPress site. I placed on the header and I added this HTML code to the header.php
<!-- This is my extra div element-->
<div class="extra-top"> <?php echo ' <a class="extra-topie" href="tel:6172010333">Call Us Now: (617) 201-0333</a> '; ?></div>
<!-- Ends extra div element-->
But the Anchor text is not working: it's not clickable yet.
For me work... But why you insert PHP echo if not use no variable?
Try this:
<!-- This is my extra div element-->
<div class="extra-top"><a class="extra-topie" href="tel:6172010333">Call Us Now: (617) 201-0333</a></div>
<!-- Ends extra div element-->
This suppose to work both the PHP and Direct HTML if you place it the right place.
If it is still not clickable, that mean you have issue with associated Application to handle dialer in Windows.. try from mobile and it should show its working.
Just tried that on my WordPress, it didn't work in desktop because I don't have default phone dialer ..but worked from mobile.
currently working on
graphotic.com
these are four section on home page....(these are posts)
Branding
Graphic Design
Packaging
Printing
and using the php the_excerpt() function;
In the theme, this php line is responsible to display the content from the post, with read more link....
<?php the_excerpt(); ?> Read More>>
now the the issue is; i want to justify the excerpt content, but i am not able to find the <p> sothat i can put align=justify..
please help
the_excerpt(); will output paragraph tags. Trying to wrap the function in paragraph tags will result in invalid markup and the styling won't work.
Use a div tag instead:
<div class="post-excerpt">
<?php the_excerpt(); ?>
</div>
Or:
<div style="text-align: justify;">
Remember to add a rule to your stylesheet for the first option. As other users have already pointed out the second option isn't considered best practice.
.post-excerpt {
text-align: justify;
}
I'm working with Drupal for the first time, and have been able to find answers for all of my other questions, so far, on either Drupal's forms or via other means. However, I can't seem to find a way to remove the "Main Menu" header from my superfish menu.
I've created a region called superfish and added superfish to it successfully. But above the menu there is an Main Menu that I would like to remove. There doesn't seem to be a way to do this from the superfish options, and i can't seem to find where in the code this is being appended, or else I would just comment out that line. I've searched in the superfish.js file as well as the 'superfish.module` file and can't seem to find it. I'm a programmer first and a 'web designer' second, so getting my hands dirty in some code is not a problem, in fact, I would prefer to do it that way.
Has anyone else done this? Or know where I should start to look?
This is the html that is generated at runtime:
<div id="superfish">
<div class="region region-superfish">
<div id="block-superfish-1" class="block block-superfish contextual-links-region">
<h2>Main menu</h2>
<div class="contextual-links-wrapper contextual-links-processed">
<div class="content">
<ul id="superfish-1" class="menu sf-menu sf-main-menu sf-horizontal sf-style-simple sf-total-items-2 sf-parent-items-1 sf-single-items-1 superfish-processed sf-js-enabled sf-shadow">
<li id="menu-221-1" class="active-trail first odd sf-item-1 sf-depth-1 sf-no-children">
<li id="menu-312-1" class="active-trail last even sf-item-2 sf-depth-1 sf-total-children-1 sf-parent-children-0 sf-single-children-1 menuparent">
</ul>
</div>
</div>
</div>
Thanks!
I stumbled across the real answer... Isn't it funny that one tends to figure things out when they stop thinking about them?
The main menu header was the block title, when editing the superfish block the very first field is Block Title this allows one to override the default setting of the block title. By placing <none> in this field, the block title is no longer displayed.
Apart from finding where that HTML is output, which is the ideal solution, you could use jquery after the fact to remove the title.
$('#superfish h2').html('');
jsfiddle here: http://jsfiddle.net/DetEb/