• Resolved ecomprosk

    (@ecomprosk)


    Hey, how can i colour marketing flags based on status

    Let – Red

    To Let – Green

    For Sale – Green

    Sold – Red

    The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 16 total)
  • Plugin Author Property Hive

    (@propertyhive)

    @ecomprosk You’ll see here (https://docs.wp-property-hive.com/add-ons/template-assistant/flags/) a bit about the classes applied to the flags.

    As such you can add some custom CSS like so to colour these accordingly:

    .flag-let { background: red !important }
    .flag-to-let { background: green !important }
    ... etc

    Thanks,
    Steve

    Thread Starter ecomprosk

    (@ecomprosk)

    Hey Steve Apologies but this doesnt seem to work for me.

    Can you give me step by steps sorry to be a pain.

    Best regards

    Plugin Author Property Hive

    (@propertyhive)

    How are you adding the flags out of interest? Are you using a bespoke snippet somewhere or using our free Template Assistant add on? If the latter, which version?

    The only reason I ask is that from looking at the site, the flags don’t have the unique class on that I mentioned previously so at present you won’t be able to colour them separately.

    Thanks,
    Steve

    Thread Starter ecomprosk

    (@ecomprosk)

    Bespoke snippet,

    .properties li.property .thumbnail a { display:block; height:100%; position:relative; }
    .properties li.property .thumbnail .flag { position:absolute; top:0; left:0;
    padding: 5px;
    	background:#000; color:#FFF; }
    
    .columns-2 ul.properties li.property .thumbnail img, .columns-3 ul.properties li.property .thumbnail img, .columns-4 ul.properties li.property .thumbnail img, .columns-5 ul.properties li.property .thumbnail img, .columns-6 ul.properties li.property .thumbnail img {
    	width: 500px;
    	height: 200px;
    }
    Plugin Author Property Hive

    (@propertyhive)

    @ecomprosk Do you have the bespoke snippet of PHP? That code provided is CSS and isn’t relevant.

    Thanks,
    Steve

    Thread Starter ecomprosk

    (@ecomprosk)

    Sorry mate, please see below

    add_action( ‘propertyhive_before_search_results_loop_item_title’, ‘add_flag’, 5 );
    function add_flag()
    {
    global $property;

    $flag = $property->availability;

    if ( $property->marketing_flag != ” )
    {
    $flag = $property->marketing_flag;
    }

    if ( $flag != ” )
    {
    echo ‘<div class=”flag”>’ . $flag . ‘</div>’;
    }
    }

    Plugin Author Property Hive

    (@propertyhive)

    Thanks. Change this line:

    echo ‘<div class=”flag”>’ . $flag . ‘</div>’;

    to:

    echo ‘<div class=”flag flag-‘ . sanitize_title($flag) . ‘”>’ . $flag . ‘</div>’;

    Once that’s done the original CSS I provided will work accordingly.

    Steve

    Thread Starter ecomprosk

    (@ecomprosk)

    So sorry Steve, i don’t know what i’ve done but seem to have broken the site

    <?php
    /**
     * Honeycomb functions.php
     *
     * @package honeycomb
     */
    
    /**
     * Assign the Honeycomb version to a var
     */
    $theme              = wp_get_theme( 'honeycomb' );
    $honeycomb_version = $theme['Version'];
    
    /**
     * Set the content width based on the theme's design and stylesheet.
     */
    if ( ! isset( $content_width ) ) {
    	$content_width = 980; /* pixels */
    }
    
    $honeycomb = (object) array(
    	'version' => $honeycomb_version,
    
    	/**
    	 * Initialize all the things.
    	 */
    	'main'       => require 'inc/class-honeycomb.php',
    	'customizer' => require 'inc/customizer/class-honeycomb-customizer.php',
    );
    
    require 'inc/honeycomb-functions.php';
    require 'inc/honeycomb-template-hooks.php';
    require 'inc/honeycomb-template-functions.php';
    
    if ( class_exists( 'Jetpack' ) ) {
    	$honeycomb->jetpack = require 'inc/jetpack/class-honeycomb-jetpack.php';
    }
    
    if ( honeycomb_is_propertyhive_activated() ) {
    	$honeycomb->propertyhive = require 'inc/propertyhive/class-honeycomb-propertyhive.php';
    
    	require 'inc/propertyhive/honeycomb-propertyhive-template-hooks.php';
    	require 'inc/propertyhive/honeycomb-propertyhive-template-functions.php';
    }
    
    if ( is_admin() ) {
    	$honeycomb->admin = require 'inc/admin/class-honeycomb-admin.php';
    }
    
    if( is_admin() && file_exists(  dirname( __FILE__ ) . '/inc/honeycomb-update.php' ) ) {
        include_once( dirname( __FILE__ ) . '/inc/honeycomb-update.php' );
    }
    
    add_action( ‘propertyhive_before_search_results_loop_item_title’, ‘add_flag’, 5 );
    function add_flag()
    {
    global $property;
    
    $flag = $property->availability;
    
    if ( $property->marketing_flag != ” )
    {
    $flag = $property->marketing_flag;
    }
    
    if ( $flag != ” )
    {
    ‘<div class=”flag flag-‘ . sanitize_title($flag) . ‘”>’ . $flag . ‘</div>’;
    }
    }
    
    // Setup two separate URLs
    add_action( 'init', 'ph_add_rewrite_rules' );
    function ph_add_rewrite_rules() 
    {
        global $wp_rewrite;
         
        // Setup Sales URL '/sales/'
        add_rewrite_rule( "sales/?$", "index.php?post_type=property&department=residential-sales", 'top' );
        add_rewrite_rule( "sales/{$wp_rewrite->pagination_base}/([0-9]{1,})/?$", "index.php?post_type=property&department=residential-sales" . '&paged=$matches[1]', 'top' );
         
        // Setup Lettings URL '/lettings/'
        add_rewrite_rule( "lettings/?$", "index.php?post_type=property&department=residential-lettings", 'top' );
        add_rewrite_rule( "lettings/{$wp_rewrite->pagination_base}/([0-9]{1,})/?$", "index.php?post_type=property&department=residential-lettings" . '&paged=$matches[1]', 'top' );
    	
    	    // Setup Commercial URL '/commercial/'
        add_rewrite_rule( "commercial/?$", "index.php?post_type=property&department=commercial", 'top' );
        add_rewrite_rule( "commercial/{$wp_rewrite->pagination_base}/([0-9]{1,})/?$", "index.php?post_type=property&department=commercial" . '&paged=$matches[1]', 'top' );
    }
     
    // Add support for Property Hive custom query_vars
    add_filter( 'query_vars', 'add_query_vars' );
    function add_query_vars( $query_vars ) 
    {
        $query_vars[] = 'department';
        $query_vars[] = 'address_keyword';
        $query_vars[] = 'marketing_flag';
        $query_vars[] = 'minimum_price';
        $query_vars[] = 'maximum_price';
        $query_vars[] = 'minimum_rent';
        $query_vars[] = 'maximum_rent';
        $query_vars[] = 'minimum_bedrooms';
        $query_vars[] = 'minimum_floor_area';
        $query_vars[] = 'maximum_floor_area';
        $query_vars[] = 'property_type';
        $query_vars[] = 'commercial_property_type';
        $query_vars[] = 'office';
        $query_vars[] = 'view';
        $query_vars[] = 'radius';
        $query_vars[] = 'pgp';
        // append here any other query string parameters you might be using
     
        return $query_vars;
    }
     
    // Convert all query_vars found to $_GET and $_REQUEST parameters as this is what the search form and main property query are based off
    add_action( 'parse_request', 'setup_get' );
    function setup_get($wp_query)
    {
        foreach ($wp_query->query_vars as $name => $value)
        {
            if (!empty($value) && $name != 'name')
            {
                $_GET[$name] = $value;
                $_REQUEST[$name] = $value;
            }
        }
    }
    
    /**
     * Note: Do not add any custom code here. Please use a custom plugin or child theme so that your customizations aren't lost during updates.
     */
    Plugin Author Property Hive

    (@propertyhive)

    I think it’s the apostrophes. The WP forums converts them. Make sure the code you copied from my latest reply uses normal quotes and double quotes.

    That should sort it.

    Thanks,
    Steve

    Thread Starter ecomprosk

    (@ecomprosk)

    Hey Steve,

    sorry man it’s really not working for me, neither is the marketing flag options on the plugin under custom fields.

    Is there any chance you can just send me the exact code via email if needed or something?

    Plugin Author Property Hive

    (@propertyhive)

    Sending the snippet via a gist below to avoid any issues with quotes etc:

    https://gist.github.com/propertyhive/e5899fbc2a75bfe3b5dde00146a2ae79

    Thread Starter ecomprosk

    (@ecomprosk)

    That works perfectly well, what would be the CSS required to achieve the initial goal, the one provided doesnt work.

    Thank you for all your help.

    Plugin Author Property Hive

    (@propertyhive)

    “what would be the CSS required to achieve the initial goal”
    The CSS provided initially is still valid and will work. Where have you added it as I can’t see it anywhere on the site?

    Steve

    Thread Starter ecomprosk

    (@ecomprosk)

    Plugin Author Property Hive

    (@propertyhive)

    That link doesn’t show me anything, just a white cross.

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Marketing Flags – Colour’ is closed to new replies.