Skip to content

Instantly share code, notes, and snippets.

@doubleedesign

doubleedesign/wc-house-product-attributes.php

Last active May 26, 2017 05:51
Show Gist options
  • Save doubleedesign/e6b87dedd345140c263e3d7e1995e50c to your computer and use it in GitHub Desktop.
Save doubleedesign/e6b87dedd345140c263e3d7e1995e50c to your computer and use it in GitHub Desktop.
Download ZIP
Custom display of product attributes for a home builder or property developer site. Used on www.davrose.com.au
Raw
wc-house-product-attributes.php
<?php
/*
Highly customised output of product attributes
These functions can be used in hooks in functions/woocommerce.php or directly in templates
Functions:
1. doublee_home_room_attributes() gets the number of bedrooms, bathrooms and car spaces and outputs them as a list.
2. doublee_duo_home_room_attributes() gets the number of bedrooms, bathrooms and car spaces for both residences and outputs them in a condensed list. Used where doublee_home_room_attributes() is not appropriate
2. doublee_home_dimensions_attributes() gets the living area size, total area size, minimum block width and number of storeys and displays them in a table.
3. doublee_home_floorplan_image() gets and outputs the floorplan image, which is an ACF field.
*/
function doublee_home_room_attributes() {
// Get product attribute values
global $product;
$formatted_attributes = array();
$attributes = $product->get_attributes();
foreach($attributes as $attr=>$attr_deets){
$attribute_label = wc_attribute_label($attr);
if ( isset( $attributes[ $attr ] ) || isset( $attributes[ 'pa_' . $attr ] ) ) {
$attribute = isset( $attributes[ $attr ] ) ? $attributes[ $attr ] : $attributes[ 'pa_' . $attr ];
if ( $attribute['is_taxonomy'] ) {
$formatted_attributes[$attribute_label] = implode( ', ', wc_get_product_terms( $product->id, $attribute['name'], array( 'fields' => 'names' ) ) );
} else {
$formatted_attributes[$attribute_label] = $attribute['value'];
}
}
}
// The ones we want for this function
// Most will be have one value, but we must allow for two and output a second set for the duo homes
// So let's turn the string returned into an array so we can split into two sets where relevant.
$bedrooms_field = $formatted_attributes['Bedrooms'];
$bathrooms_field = $formatted_attributes['Bathrooms'];
$carspaces_field = $formatted_attributes['Car spaces'];
$bedrooms_array = explode(', ', $bedrooms_field);
$bathrooms_array = explode(', ', $bathrooms_field);
$carspaces_array = explode(', ', $carspaces_field);
$bedrooms = $bedrooms_array[0];
$bathrooms = $bathrooms_array[0];
$carspaces = $carspaces_array[0];
$bedrooms2 = $bedrooms_array[1];
$bathrooms2 = $bathrooms_array[1];
$carspaces2 = $carspaces_array[1];
// Output them
?>
<?php
// Only output label if there's a second set of values
if ( (!empty($bedrooms2)) || (!empty($bathrooms2)) || (!empty($bathrooms2)) ){ ?>
<span class="residence-1 title">Residence 1</span>
<?php } ?>
<ul class="room attributes">
<li class="bedrooms"><?php echo $bedrooms; ?></li>
<li class="bathrooms"><?php echo $bathrooms; ?></li>
<li class="carspaces"><?php echo $carspaces; ?></li>
</ul>
<?php
// Only output label and second table if there's a second set of values
if ( (!empty($bedrooms2)) || (!empty($bathrooms2)) || (!empty($bathrooms2)) ){ ?>
<span class="residence-2 title">Residence 2</span>
<ul class="second room attributes">
<li class="bedrooms"><?php echo $bedrooms2; ?></li>
<li class="bathrooms"><?php echo $bathrooms2; ?></li>
<li class="carspaces">
<?php // If $carspaces2 doesn't exist, assume Residence 2 has the same number as Residence 1 and use $carspaces
if (!empty($carspaces2)) { echo $carspaces2; } else { echo $carspaces; } ?>
</li>
</ul>
<?php } ?>
<?php }
function doublee_duo_home_room_attributes() {
// Get product attribute values
global $product;
$formatted_attributes = array();
$attributes = $product->get_attributes();
foreach($attributes as $attr=>$attr_deets){
$attribute_label = wc_attribute_label($attr);
if ( isset( $attributes[ $attr ] ) || isset( $attributes[ 'pa_' . $attr ] ) ) {
$attribute = isset( $attributes[ $attr ] ) ? $attributes[ $attr ] : $attributes[ 'pa_' . $attr ];
if ( $attribute['is_taxonomy'] ) {
$formatted_attributes[$attribute_label] = implode( ', ', wc_get_product_terms( $product->id, $attribute['name'], array( 'fields' => 'names' ) ) );
} else {
$formatted_attributes[$attribute_label] = $attribute['value'];
}
}
}
// The ones we want for this function
// Looking for two values, so let's turn the string returned into an array so we can split into two sets where relevant.
$bedrooms_field = $formatted_attributes['Bedrooms'];
$bathrooms_field = $formatted_attributes['Bathrooms'];
$carspaces_field = $formatted_attributes['Car spaces'];
$bedrooms_array = explode(', ', $bedrooms_field);
$bathrooms_array = explode(', ', $bathrooms_field);
$carspaces_array = explode(', ', $carspaces_field);
$bedrooms = $bedrooms_array[0];
$bathrooms = $bathrooms_array[0];
$carspaces = $carspaces_array[0];
$bedrooms2 = $bedrooms_array[1];
$bathrooms2 = $bathrooms_array[1];
$carspaces2 = $carspaces_array[1];
// Output them as a condensed list
?>
<ul class="room attributes">
<li class="bedrooms"><?php echo $bedrooms; ?> / <?php echo $bedrooms2; ?></li>
<li class="bathrooms"><?php echo $bathrooms; ?> / <?php echo $bathrooms2; ?></li>
<li class="carspaces"><?php echo $carspaces; ?> / <?php echo $carspaces2; ?></li>
</ul>
<?php }
function doublee_home_dimensions_attributes() {
// Get product attribute values
global $product;
$formatted_attributes = array();
$attributes = $product->get_attributes();
foreach($attributes as $attr=>$attr_deets){
$attribute_label = wc_attribute_label($attr);
if ( isset( $attributes[ $attr ] ) || isset( $attributes[ 'pa_' . $attr ] ) ) {
$attribute = isset( $attributes[ $attr ] ) ? $attributes[ $attr ] : $attributes[ 'pa_' . $attr ];
if ( $attribute['is_taxonomy'] ) {
$formatted_attributes[$attribute_label] = implode( ', ', wc_get_product_terms( $product->id, $attribute['name'], array( 'fields' => 'names' ) ) );
} else {
$formatted_attributes[$attribute_label] = $attribute['value'];
}
}
}
// The ones we want for this function
// Most will be have one value, but we must allow for two and output a second set for the duo homes
// So let's turn the string returned into an array so we can split into two sets where relevant.
$living_field = $formatted_attributes['living-area'];
$total_field = $formatted_attributes['total-area'];
$minblock_field = $formatted_attributes['minimum-block-width'];
$storeys_field = $formatted_attributes['Storeys'];
$living_array = explode('| ', $living_field);
$total_array = explode('| ', $total_field);
$minblock_array = explode('| ', $minblock_field);
$storeys_array = explode('| ', $storeys_field);
$living = $living_array[0];
$total = $total_array[0];
$minblock = $minblock_array[0];
$storeys = $storeys_array[0];
$living2 = $living_array[1];
$total2 = $total_array[1];
$minblock2 = $minblock_array[1];
$storeys2 = $storeys_array[1];
// Output them
?>
<?php
// Only output heading and second table if there's a second set of values
if ( (!empty($living2)) || (!empty($total2)) || (!empty($minblock2)) || (!empty($storeys2)) ) { ?>
<h3 class="residence-1">Residence 1</h3>
<?php } ?>
<table class="dimension attributes">
<tbody>
<?php if(!empty($living)) { ?>
<tr>
<th scope="row">Living area</th>
<td><?php echo $living; ?>m<sup>2</sup></td>
</tr>
<?php } ?>
<?php if(!empty($total)) { ?>
<tr>
<th scope="row">Total area</th>
<td><?php echo $total; ?>m<sup>2</sup></td>
</tr>
<?php } ?>
<?php if(!empty($minblock)) { ?>
<tr>
<th scope="row">Minimum block width</th>
<td><?php echo $minblock; ?>m</td>
</tr>
<?php } ?>
<?php if(!empty($storeys)) { ?>
<tr>
<th scope="row">Storeys</th>
<td><?php echo $storeys; ?></td>
</tr>
<?php } ?>
</tbody>
</table>
<?php
// Only output heading and second table if there's a second set of values
if ( (!empty($living2)) || (!empty($total2)) || (!empty($minblock2)) || (!empty($storeys2)) ) { ?>
<h3 class="residence-2">Residence 2</h3>
<table class="second dimension attributes">
<tbody>
<?php if(!empty($living2)) { ?>
<tr>
<th scope="row">Living area</th>
<td><?php echo $living2; ?>m<sup>2</sup></td>
</tr>
<?php } ?>
<?php if(!empty($total2)) { ?>
<tr>
<th scope="row">Total area</th>
<td><?php echo $total2; ?>m<sup>2</sup></td>
</tr>
<?php } ?>
<?php if(!empty($minblock2)) { ?>
<tr>
<th scope="row">Minimum block width</th>
<td><?php echo $minblock2; ?>m</td>
</tr>
<?php } ?>
<?php if(!empty($storeys) || (!empty($storeys2))) { ?>
<tr>
<th scope="row">Storeys</th>
<td><?php if(!empty($storeys2)) { echo $storeys2; } else { echo $storeys; } ?></td>
</tr>
<?php } ?>
</tbody>
</table>
<?php } ?>
<?php }
function doublee_home_floorplan_image() {
global $post;
$floorplan_field = get_field('floorplan_image');
$floorplan_preview = $floorplan_field['sizes']['floorplan'];
$floorplan_full = $floorplan_field['url'];
echo '<div class="floorplan">';
echo '<a href="'. $floorplan_full .'" rel="swipebox"><img src="' . $floorplan_preview . '" alt="' . $post->post_title . ' floorplan" /></a>';
echo '</div>';
}
?>
Raw
woocommerce-functions.php
// Add custom attributes using hooks and filters rather than overriding templates
// Add to product lists (e.g. product category page)
add_action( 'woocommerce_after_shop_loop_item_title', 'doublee_home_room_attributes', 10 );
// Add to the single product summary div
add_action( 'woocommerce_single_product_summary', 'doublee_home_room_attributes', 5 );
add_action( 'woocommerce_single_product_summary', 'doublee_home_dimensions_attributes', 30 );
// end custom attributes implementation
Raw
woocommerce-house-attributes.scss
/* Note: This uses Zurb Foundation grid mixins, and a custom mixin for FontAwesome icons.
Vanilla SCSS in comments below each mixin. */
/* Attributes */
ul.attributes {
list-style: none;
margin: 0;
@include flex-grid-row();
/*
display: flex;
flex-flow: row wrap;
*/
justify-content: space-between;
li {
@include flex-grid-column(shrink, 0);
/*
flex-grow: 0;
flex-shrink: 0;
flex-basis: auto;
padding-left: 0;
padding-right: 0;
*/
&:before {
padding-right: $global-padding/4;
/*
padding-right: 4px;
font-family: "FontAwesome";
*/
font-size: 1.2em;
}
&.bedrooms {
&:before {
@include icon('\f236');
/*
content: '\f236';
*/
}
}
&.bathrooms {
&:before {
@include icon('\f2cd');
/*
content: '\f2cd';
*/
}
}
&.carspaces {
&:before {
@include icon('\f1b9');
/*
content: '\f1b9';
*/
}
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment