WordPress custom taxonomy parent-child navigation menu - wordpress-theming

I'm trying to create the following menu structure from custom taxonomies:
CAT 1
-SubCat1
-SubCat2
CAT 2
CAT 3
CAT 4
What I want to achieve is when I click on a child category (SubCat1 for example) My current navigation structure should stay the same, and bold the current subcat.
When I click on another PARENT category, it's subcategories should appear and the the rest of the parent cats only (not all the cats with subcats).
My problems are the following:
I managed the create the child navigation menu when clicking on a parent category, but it only shows the CURRENT and the CHILD LEVEL categories in the menu, without the other main categories using this code:
<?php
$taxonomy = $tax;
$orderby = 'name';
$show_count = 1; // 1 for yes, 0 for no
$pad_counts = 0; // 1 for yes, 0 for no
$hierarchical = 1; // 1 for yes, 0 for no
$title = '';
if (get_term_children($term->term_id, $tax) != null) {
$child = $term->term_id;
} else {
$child = '';
}
$args = array(
'taxonomy' => $taxonomy,
'orderby' => $orderby,
'show_count' => $show_count,
'pad_counts' => $pad_counts,
'hierarchical' => $hierarchical,
'title_li' => $title,
'child_of' => $child,
'current_category' => 0
);
?>
<? if (get_term_children($term->term_id, $tax) != null) { ?>
<h3><?php echo $term->name; ?> Templates</h3>
<? } ?>
<?php
wp_list_categories( $args ); ?>
The problem is with the above code that when I click on a child category all my parent/subcategories are displayed again.
I want to be able to stay on the same structure when browsing any of the subcategories from one big category with the addition of the bold font face to the subcategory I'm browsing.
If this makes sense to someone please help.
Thanks,

What I would do is create a custom query to loop through the taxonomy with a parent of 0 then in the loop of displaying them do the get_term_children function. I believe that is the best way to create something like this. This is what I have done in my plugin and it has allowed me to have much more customisation.

Related

How to put all product attributes below description without shortcode Woocommerce

currently I've used this code and put shortcode and id in every product post.
add_shortcode("product_attributes", "display_product_attributes");
function display_product_attributes( $atts ) {
// Shortcode attribute (or argument)
$atts = shortcode_atts(
array(
'id' => ''
),
$atts, 'product_attributes'
);
if( ! ( isset($atts['id']) && $atts['id'] > 0 ) ) return;
$product = wc_get_product($atts['id']);
ob_start();
do_action( 'woocommerce_product_additional_information', $product );
return ob_get_clean();
}
Can someone share new code that I don't need to use shortcode and it's will automaticly show additional product information in every below product description post?
Example like picture below
combine description and additional information

How to display a div in a post in your category page - wordpress

I have a website where each post is displayed and each post has a description explaining the post.
How can I get my category page (the page that summarises all posts) to show only the small summary of the post and nothing else. At the moment I am using
the_excerpt();
but this limits the text to 55 words, however some are smaller than that, and so other text is displayed in the category that I don’t want.
For example, this is an example post:
http://thestudentbubble.com/hidden-gems/hidden-gems-restaurants/ganges-indian/
As you can see below the description is additional information which I don't want it to appear on the category page.
this is the category page - http://thestudentbubble.com/hidden-gems/hidden-gems-restaurants/
yet the additional information that I don't want to appear still appears.
The text I want to appear is in:
<div class = "bioText">
How can I make only the text in the div appear in the category page?
Thank you for the help!
this is the category loop :
<div class="comment">
<?php
$cats = get_the_category();
$category_id = $cats[0]->cat_ID;
$args = array( 'posts_per_page' => 1, 'category' => $category_id);
$lastposts = get_posts( $args );
foreach ( $lastposts as $post ) :
$this_post_ID = get_the_ID();
$this_post_preview = get_post_meta( $this_post_ID, 'post_preview', true );
echo $this_post_preview;
//the_excerpt();
//the_content();
wp_reset_postdata();
endforeach;
?>
</div>
Ok then, the first thing to do is to create a custom textarea in each post's admin panel. It will appear under the editor. Let's create the .php file that will contain our code, call it post_preview_field.php, and place it in the theme root folder. After doing that, we will need to reference it in our functions.php file. This is done by simply adding the following line:
require_once(get_template_directory().'/post_preview_field.php');
Let's open our post_preview_field.php file and write the code.
<?php
add_action( 'add_meta_boxes', 'post_preview_metabox' );
add_action( 'save_post', 'post_preview_save_postdata' );
function post_preview_metabox() {
$screens = array( 'post' );
foreach ($screens as $screen) {
add_meta_box(
'post_preview_metabox_id',
__( 'Post Preview', 'post_preview_textdomain'),
'post_preview_inner_boxes',
$screen
);
}
}
function post_preview_inner_boxes( $post ) {
wp_nonce_field( plugin_basename( __FILE__ ), 'post_preview_noncename' );
$post_preview_value = get_post_meta( $post->ID, 'post_preview', true );
echo '<label for="post_preview_new_field">';
_e("", 'post_preview_textdomain' );
?>
</label>
<textarea name="post_preview_new_field" id="post_preview_new_field" ><?php echo $post_preview_value; ?></textarea>
<?php }
function post_preview_save_postdata( $post_id ) {
if ( 'post' == $_POST['post_type'] ) {
if ( ! current_user_can( 'edit_page', $post_id ) )
return;
} else {}
if ( ! isset( $_POST['post_preview_noncename'] ) || ! wp_verify_nonce( $_POST['post_preview_noncename'], plugin_basename( __FILE__ ) ) )
return;
$post_ID = $_POST['post_ID'];
$post_preview = ( $_POST['post_preview_new_field'] );
add_post_meta($post_ID, 'post_preview', $post_preview, true) or
update_post_meta($post_ID, 'post_preview', $post_preview);
}
?>
Here we go. We just created a textarea field that appears in every post's panel, can contain some text, is saved every time we save\update the post and is stored in the post's metadata.
Now, all we have to do is access this value in the frontend and echo it. How do we do that?
In the loop, we first assign the post ID to a variable:
$this_post_ID = get_the_ID();
and then assign the data we stored to another:
$this_post_preview = get_post_meta( $this_post_ID, 'post_preview', true );
That's it. We can now echo the preview:
echo $this_post_preview;
I managed to solve it by adding
<!--more-->
after each of the descriptions.

using PHP simple html dom get attributes name in span?

I am not if 'tags' are the right term but i have to get the "data-time" values from this span into an array. How can I use simple html dom to get them?
Here is on span I am trying to get the "data-time" out of.
include('../simpleHtmlDom/simple_html_dom.php');
// Put the Twitters username here
$user = "yadayada";
$html = file_get_html("https://twitter.com/$user");
$ret = $html->find('div[class=ProfileTweet-contents]');
$ret = $html->find('p[class=ProfileTweet-text js-tweet-text u-dir]');
/// tries to get the time code but does only gets the span
$date = $html->find('span[class=js-short-timestamp js-relative-timestamp]', 0);
$DoesNotWork = $html->find( "data-time", 0 );
echo $ret[1]; // get's a users tweet.
echo $DoesNotWork;
The result of the date
<span class="js-short-timestamp js-relative-timestamp"
data-time="1401528672"
data-long-form="true">
15h
</span>
I would think it is something like this but this code does not work.
$html->find( "data-time", 0 );
You may try this:
// Include the script
$url = 'https://twitter.com/yourusername';
$html = file_get_html($url);
$dateTimes = array();
foreach ($html->find('div.GridTimeline .js-short-timestamp') as $value) {
$dateTimes[] = $value->innertext;
}
Result of print_r($dateTimes);:
Array
(
[0] => 2h
[1] => 2h
[2] => 2h
// Truncated...
[10] => 11h
[11] => May 30
[12] => May 30
[13] => May 6
// Truncated...
)
I was able to get the date using this code, tho I think there is a better way. I think it would be best to find a simple dom code that gets the text of the date-time in line
<span class"js-short-timestamp js-relative-timestamp" date-time="89393748474">
but instead I used two "list" php lines as seen below and that worked.
$dateTimes = array();
foreach ($html->find('div.GridTimeline .js-short-timestamp') as $value) {
$dateTimes[] = $value->outertext;
}
// These are the lines I get the date-time from.
list($Gone,$Keep) = explode("data-time=\"", $dateTimes[0]);
list($Date,$Gone) = explode("\"", $Keep);
$Date = date('M d, Y', $Date);
You want to use:
$html->find( "[data-time]", 0 );
In case anyone landing here in 2021, following no 1 google search result:
Unless I misinterpreted your intention, you might achieve what you want using (with simplehtmldom):
$html->find('span[data-time]')->attr[data-time];
The official simplehtmldom documentation fails to mention that. However, https://stackoverflow.com/a/14456823/10050838 is one possible source.

Html/CSS results page / scorecard for cricket in WordPress

I'm new to web-design and in process of creating a sports website based on the WordPress platform.
One of the sports that the site will be covering is cricket. My site is almost done, but I'm stuck at few very important CSS/Html tables for data. I would really appreciate if someone here could guide/help me on how to create tables like the ones in the links bellow or whether there is anyway someone can copy html/css from an existing site and style it.
I just need a copy of the tables, sorting options are not needed
Similar scorecard as light as possible would be great
Are these things possible with CSS/html in Wordpress or is there any better option for such tables?
Here are two solutions you could use:
Solution #1: TabPress Plugin
Through a graphical panel, you can fully customize your table. You can set your own CSS, you can have colspan, rowspan or all together. Check out the demo. If you don't want to spend too much time in coding, give it a try.
Solution #2: WP_List_Table
It's available since WordPress 3.1. WP 3.1 uses it to build the tables you can see in the admin panel. The table who displays the posts for instance uses this class. However, you can disable some features such as sorting, bulk operations etc.
Here is a sample code taken from one of my blogs. I wanted to display a table of statistics with no sorting option. Call ff_show_stats() to display the table from your PHP code.
if( ! class_exists( 'WP_List_Table' ) ) {
require_once( ABSPATH . 'wp-admin/includes/class-wp-list-table.php' );
}
class FFStatsTable extends WP_List_Table {
function __construct(){
}
function get_columns(){
$columns = array(
'id' => 'ID',
'creation' => 'Creation',
'country' => 'Country'
// Add as much column as you want
// 'column_name_in_query' => 'Displayed column name'
);
return $columns;
}
function column_default( $item, $column_name ) {
switch( $column_name ) {
case 'id':
case 'creation':
case 'country':
return $item[ $column_name ];
default:
return print_r( $item, true ) ; //Show the whole array for debugging purposes
}
}
function prepare_items() {
global $wpdb;
$columns = $this->get_columns();
$hidden = array();
$sortable = array();//Empty array for disabling sorting
$this->_column_headers = array($columns, $hidden, $sortable);
$this->items = $wpdb->get_results(
"SELECT id,creation,country FROM wp_my_table WHERE my_condtion=TRUE",
ARRAY_A
);
}
}
function ff_show_stats() {
$myListTable = new FFStatsTable();
echo '<div class="wrap"><h2>Stats</h2>';
$myListTable->prepare_items();
$myListTable->display();
echo '</div>';
}
You can have a more detailed sample code here : http://plugins.svn.wordpress.org/custom-list-table-example/tags/1.2/list-table-example.php

How can I display images similar to Tumblr's photosets?

I'm converting my wife's blog over to Wordpress and I want to display image galleries similar to how they're displayed on Tumblr. Here's an example of the layout:
http://bobbyandmaura.com/post/8195960363/photoset_iframe/bobbyandmaura/tumblr_lp2nebJFEW1qhd8ae/500
I can handle the markup and CSS for displaying the images. What I need help with is understanding how I can create this dynamically. Tumblr is smart enough to dynamically display different quantities of images while still always filling all of the space. Here's another example with fewer image:
http://bobbyandmaura.com/post/6700400507/photoset_iframe/bobbyandmaura/tumblr_ln23gi8EqU1qhd8ae/500
Hopefully I can use math to create a dynamic solution so I don't have to manually create a bunch of different possibilities.
OK. Solved. I got a hack to show WP gallery as Tumblr photoset. It is not as customizable as Tumblr, this will only show the first image as the cover image(larger) and rest images in small grid like set.
You need to edit wp-includes/media.php file. If your theme as any other gallery file, you have to edit that. Edit at your own risk as this is core file of WP. If you update your WP in future, you have to do this again. Sorry, I have no time to write a plugin.
Search for "foreach ( $attachments as $id => $attachment )" in wp-includes/media.php and change the following (replace the foreach loop)
$ccg = 1;
foreach ( $attachments as $id => $attachment ) {
if($ccg == 1)
{
$link = isset($attr['link']) && 'file' == $attr['link'] ? wp_get_attachment_link($id, large, false, false) : wp_get_attachment_link($id, $size, true, false);
}
else
{
$link = isset($attr['link']) && 'file' == $attr['link'] ? wp_get_attachment_link($id, $size, false, false) : wp_get_attachment_link($id, $size, true, false);
}
$output .= "<{$itemtag} class='gallery-item'>";
$output .= "
<{$icontag} class='gallery-icon'>
$link
</{$icontag}>";
if ( $captiontag && trim($attachment->post_excerpt) ) {
$output .= "
<{$captiontag} class='wp-caption-text gallery-caption'>
" . wptexturize($attachment->post_excerpt) . "
</{$captiontag}>";
}
$output .= "</{$itemtag}>";
if ( ( $columns > 1 && ++$i % $columns == 1) || $ccg == 1 )
$output .= '<br style="clear: both" />';
$ccg++;
}
Demo gallery can be found at http://ontrip.in/the-ca-cur-badi-forest-resort-gorumara/
You may need to modify your Gallery columns number. You may select the cover image by alternating the image order in Gallery insert box.
My friend Victor Gonzáles developed Aurum to manage proportions and have that nice effect. You can get it here: https://github.com/aficiomaquinas/Aurum-CSS
You then additionally group the images by similar proportions(w/h) with a tolerance of 0.2. So that <0.2 is one group < 0.4 another, < 0.6, etc.
Then have a random chance of spawning them in 1,2,3 columns / row.