Archived topic
shortcode not displaying on a page
3 replies · Started by njwrigley on April 1, 2017
Hi there,
I have a plugin which generates a shortcode which I then copy into the text editor of a WP page:
[property_search_form id="default"]
It creates a set of search filters for CPT fields, although this is not relevant!
So in GP, this shortcode displays nothing at all.
If I switch to 2017 and the Beaver Builder theme (the two that I have to hand), they display the search dropdowns as expected.
Any ideas why this might be?
So the markup created by the shortcode is as follows. It's in the page, but GP does not display it - any thoughts... class conflicts? Possibly the .clear in the <form>?:
<form name="ph_property_search" class="property-search-form property-search-form-default clear" action="http://property-hive.dev/search-results/" method="get" role="form">
<div class="control control-minimum_price sales-only"><label for="minimum_price">Min Price</label><select
name="minimum_price"
id="minimum_price"
class=""
><option
value=""
selected='selected'
>No preference</option><option
value="100000"
>£100,000</option><option
value="150000"
>£150,000</option><option
value="200000"
>£200,000</option><option
value="250000"
>£250,000</option><option
value="300000"
>£300,000</option><option
value="500000"
>£500,000</option><option
value="750000"
>£750,000</option><option
value="1000000"
>£1,000,000</option></select></div>
<div class="control control-maximum_price sales-only"><label for="maximum_price">Max Price</label><select
name="maximum_price"
id="maximum_price"
class=""
><option
value=""
selected='selected'
>No preference</option><option
value="100000"
>£100,000</option><option
value="150000"
>£150,000</option><option
value="200000"
>£200,000</option><option
value="250000"
>£250,000</option><option
value="300000"
>£300,000</option><option
value="500000"
>£500,000</option><option
value="750000"
>£750,000</option><option
value="1000000"
>£1,000,000</option></select></div>
<div class="control control-property_type residential-only"><label for="property_type">Type</label><select
name="property_type"
id="property_type"
class=""
><option
value=""
selected='selected'
>No preference</option><option
value="18"
>Bungalow</option><option
value="19"
>- Detached Bungalow</option><option
value="20"
>- Semi-Detached Bungalow</option><option
value="21"
>- Terraced Bungalow</option><option
value="22"
>Flat / Apartment</option><option
value="24"
>- Apartment</option><option
value="28"
>- Duplex</option><option
value="23"
>- Flat</option><option
value="25"
>- Maisonette</option><option
value="27"
>- Penthouse</option><option
value="26"
>- Studio</option><option
value="29"
>- Triplex</option><option
value="9"
>House</option><option
value="17"
>- Cottage</option><option
value="10"
>- Detached House</option><option
value="13"
>- End of Terrace House</option><option
value="15"
>- Link Detached House</option><option
value="14"
>- Mews</option><option
value="11"
>- Semi-Detached House</option><option
value="12"
>- Terraced House</option><option
value="16"
>- Town House</option><option
value="30"
>Other</option><option
value="31"
>- Commercial</option><option
value="33"
>- Garage</option><option
value="32"
>- Land</option></select></div>
<div class="control control-minimum_bedrooms residential-only"><label for="minimum_bedrooms">Min Beds</label><select
name="minimum_bedrooms"
id="minimum_bedrooms"
class=""
><option
value=""
selected='selected'
>No preference</option><option
value="1"
>1</option><option
value="2"
>2</option><option
value="3"
>3</option><option
value="4"
>4</option><option
value="5"
>5</option></select></div>
<div class="control control-parking residential-only"><label for="parking">Parking</label><select
name="parking"
id="parking"
class=""
><option
value=""
selected='selected'
>No preference</option><option
value="50"
>Carport</option><option
value="48"
>Double Garage</option><option
value="46"
>Driveway</option><option
value="45"
>Off Road Parking</option><option
value="44"
>On Road Parking</option><option
value="47"
>Single Garage</option><option
value="49"
>Triple Garage</option></select></div>
<div class="control control-outside_space residential-only"><label for="outside_space">Outside Space</label><select
name="outside_space"
id="outside_space"
class=""
><option
value=""
selected='selected'
>No preference</option><option
value="42"
>Balcony</option><option
value="72"
>Over half an acre</option><option
value="43"
>South Facing Garden</option></select></div>
<input type="hidden" name="department" value="residential-sales">
<input type="submit" value="Search">
</form>
added this to style.css in GP child theme - seems to fix, but is this a good solution?
form.property-search-form.property-search-form-default.clear {
width:100%;
height: 100%;
visibility: visible;
}
GP has a .clear class meant for clearing floats that hides the element. The HTML being generated has that class, so GP is hiding the entire element.
Your CSS should be just fine :)