Currently during the sidebar registration we can mention "before_widget" and "after_widget". But this limit the extent we can wrap the widgets.
Is there a way I can display the widgets in any manner I want to, within a sidebar
e.g
<?php foreach($widgets as $widget): ?>
<div>
<h1>heading</h1>
<p>details</p>
<?=widget->show()?>
</div>
<?php endforeach; ?>
Thanks.
Related
In WordPress page, the <main> tags are wrapped by <p>s, but <div>s are not.
WordPress 4.7.12
Example 1: Using main tag
<main>
<div>this is main</div>
</main>
results
<p><main></p>
<div>this is main</div>
<p></main></p>
Example 2: Using div#main
<div id="main">
<div>this is main</div>
</div>
results
<div id="main">
<div>this is main</div>
</div>
Question
What is the trigger to wrap with <p>?
Remarks
My page.php is below.
<?php
/**
* #package WordPress
* #subpackage Default_Theme
*/
get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php remove_filter('the_content', 'wpautop'); ?>
<?php the_content('<p class="serif">' . __('Read the rest of this page »', 'kubrick') . '</p>'); ?>
<?php add_filter('the_content', 'wpautop'); ?>
<?php endwhile; endif; ?>
<?php get_footer(); ?>
<div> element is used to design to describe a container of data.
<p> element is designed to describe a paragraph of content.
<main> element represents the dominant content of the <body> of a document. The main content area consists of content that is directly related to or expands upon the central topic of a document, or the central functionality of an application.
Note: As we know <div> tag represents container and <p> tag represents paragraph of content so the can not lie in tag.
More details
It's defined in wp-includes/formatting.php#wpautop as disribed in this post.
I edited my formatting.php using the code in the post and the <p> is eliminated.
Open wp-includes/formatting.php
Find function wpautop in it.
Copy the function.
Open [your theme folder]/functions.php.
Paste 3 and rename wpautop to wpautop_fork.
Find the line defining $allblocks = '(?:table|thead|tfoot|caption|col|....
Add main (see the code below.)
Register wpautop_folk instead of wpautop.
My function.php becomes following code.
function wpautop_forked( $pee, $br = true ) {
//...
// Add 'main' at the tail.
$allblocks = '(?:table|thead|tfoot|caption|col|colgroup|tbody|tr|td|th|div|dl|dd|dt|ul|ol|li|pre|form|map|area|blockquote|address|math|style|p|h[1-6]|hr|fieldset|legend|section|article|aside|hgroup|header|footer|nav|figure|figcaption|details|menu|summary|main)'
//...
}
remove_filter('the_content', 'wpautop');
add_filter('the_content', 'wpautop_forked');
This Q&A is also helpful:
Stop Wordpress Wrapping Images In A “P” Tag
I'm creating a custom theme with bootstrap that will be used by a photographer and I'm trying to integrate it with wordpress. My main page is in the one-page style and has following sections:
cover image with page title and description
about me section
portfolio with 6 exemplary photos and link to full gallery
contact form
"About me" content can be edited in the admin panel (I created a separate "about me" page and linked up its ID with the section), portfolio photos are the featured images of the latest posts.
Navbar consists of sections titles as well as link to the gallery.
And here are my questions and problems that I need to solve:
1) How can I add a functionality to edit the cover image from the admin panel?
2) How can I display only posts from one category?
I thought about categorizing the posts with "gallery" and "portfolio" when all of the first ones would be posted in gallery, but also some of them would be featured on the home page in portfolio section.
Is it a good way to do that? How can it be achieved in code? Here is how the portfolio code looks like at the moment:
<div class="row">
<?php
$i = 1;
query_posts('showposts=6');
query_posts("catname=portfolio");
if ( have_posts() ) : while ( have_posts() ) : the_post();
?>
<div class="col-sm-4 portfolio-item">
<a href="#portfolioModal<?php echo $i; ?>" class="portfolio-link" data-toggle="modal">
<div class="caption">
<div class="caption-content">
<i class="fa fa-search-plus fa-3x"></i>
</div>
</div>
<?php
the_post_thumbnail( 'full', array('class' => 'img-responsive') );
?>
</a>
</div>
<?php $i++; ?>
<?php endwhile; endif; ?>
It publishes all of the featured images of the posts in the portfolio section. What shall I add there to display only posts categorized as 'portfolio'?
3) What is the best way to create a separate gallery in my case?
Should I create the "index.php" file with all of the code in "../gallery" folder and link it up in navbar? What should be the link destination in navbar that would lead to the gallery?
I suppose this is something simple, but couldn't find a solution anywhere.
Currently, my website shows <h1>"Products"</h1> title on shop archive page, but on single product pages as well. Is it possible to change default title on single product pages to product name?
Here is my website. As you can see, above breadcrumbs, there is a default shop title. And there I want to display, product name instead.
<section class="<?php echo esc_attr($class_name) ?>" <?php echo wp_kses_post($bg_style); ?>>
<div class="page-title-inner">
<div class="container"><h1><?php echo esc_html($page_title); ?></h1> <?php great_store_the_breadcrumb(); ?>
</div>
</div>
</section>
How can i wrap the post content in custom div in my wordpress website?
This is from the single.php file :
<div class="entry">
<?php the_content(''); // content ?>
<?php wp_link_pages(); // content pagination ?>
<div class="clear"></div>
</div><!-- end entry -->
I can't just put div around the_content() function because i have some plugins (Related posts and social sharing plugins) that append content to the the_content() function so if i put DIV around the function it will not work like i want because it will wrap also the plugins content. How can i achieve this?
Any help/ideas appreciated.
You can add a filter on the_content. Put this in your function.php.
Note that, the add_filter function has a parameter priority, check this link.
function my_content($content) {
global $post;
return '<div class="myWrapper">'.$content.'</div>';
}
add_filter('the_content', 'my_content');
I would like to display my posts in an accordion on a single page in wordpress. Not some content inside a post, but the post itself with the title as the heading and the post's content inside the collapsible part. What would be the best way to do that?
Thanks in advance!
If you have no objections for using jQuery accordion, then
display the posts acc. to the accordion's markup and load the js. This should do the work.
Something like this:
<div id="accordion">
<?php while(has_posts()) { ?>
<h3><?php the_title(); ?></h3>
<div>
<p>
<?php the_content(); ?>
</p>
</div>
<?php } ?>
(I cannot check this right now, so please verify the syntax.)
you can use the accordion functionality wordpress default functionality only need to add the accordion jquery in your header.php file and css for that then activation code like
<?php wp_enqueue_script('jquery-ui-accordion'); ?>
jQuery(document).ready(function($) {
$( "#accordion" ).accordion({
collapsible: true,
heightStyle: "content"
});
});