Theme options - Pins Management

CONTENT

Price pins
Image pins
Retina pins
Price pin css
Single Pin css
Map Cluster css

Price pins

From v 1.20.4 theme version you can enable also price pins and choose if wish to show Full Price Pins.

If the option to “Show Full Price Pins” is setup to no will show prices without before and after label and in this format : 5,23m or 6.83k

Single pin

In 2.5.3 theme version, we have added the option use Single pin, this option will decrease the loading time on your maps and it’s a good option for who don’t need to add different pins per categories/actions.

This will also help if you wish to use multiple categories/actions for properties to allow them to be filtered with Ajax on the map as well.

Map Cluster

In 2.5.3 theme version, the option to change cluster was added, you just need to upload the new cluster.

Image pins

If the option to “Use price Pins ?” is setup to no will be displayed pins you uploaded for single actions / single categories.

Theme default pins are offered in the theme pack in .png format.

Screenshot with the place where you can find the pins in the theme pack, after you unzip the all files folder you downloaded from theme forest:

You can edit these images with programs such as Fireworks.

When you edit/add default categories and actions, you’ll need to upload new Pins from Theme Options.

When you create new categories, ALWAYS LET WORDPRESS CREATE THE SLUG (title and slugs must always match for search results).

This applies for CATEGORIES, ACTIONS, CITIES and AREAS you create.

Pins dimensions should be 44*50px

Retina pins

Pins not showing on the map on retina devices.

Starting version 1.17 you can add also retina images for property pins.

If you use the theme default categories and actions – the retina images will be automatically loaded from wprentals/css/css-images

If you add custom new pins for edited/new categories or actions from theme options you’ll have to add the retina version of your pins via wp-admin – media – add image in the same month as the non retina version.

The non retina pin image (jpg or png) is added in Theme Options – Pin Management (Ex you add an image with name rent.jpg)

NOTE: demo pins have the width/height set in Google Maps API code. Your images should be 44*50 px.

If you use different pins than the demo pins, create the retina ready version of that image and add _2x at the end of the name. The pins images from themepack/pins_and_icons. You can edit colors/icons in any vector editing tool, such as Fireworks from adbose

The retina image you create must have the _2x extension after image name. Example: sale.jpg should have a retina pin named sale_2x.jpg. Size should be doubled: 88 x 96

Go to Media – add new and upload the retina pin version (same date as non retina version)

Connect via FTP and go to wp-content/uploads/year/month folder (same year/month as when you upload the non retina version from wp-admin). Copy sale_2x.jpg to that folder.

Price pins css

If you wish to add custom colors for pins with price, you can adapt below css to your categories names and add the css in theme options – design -custom css

.wpestate_marker.villa.entire-home{
background: #752253
}

.wpestate_marker.villa.entire-home{
border-top: 4px solid #752253;
}

.wpestate_marker.villa.entire-home:before{
border-top: 10px solid #752253;
}

.wpestate_marker.cabin.entire-home{
background: #752253;
}

.wpestate_marker.cabin.entire-home{
border-top: 4px solid #752253;
}

.wpestate_marker.cabin.entire-home:before{
border-top: 10px solid #752253;
}

.wpestate_marker.apartment.entire-home{
background: #752253;
}

.wpestate_marker.apartment.entire-home{
border-top: 4px solid #752253;
}

.wpestate_marker.apartment.entire-home:before{
border-top: 10px solid #752253;
}

.wpestate_marker.condos.entire-home{
background: #752253;
}

.wpestate_marker.condos.entire-home{
border-top: 4px solid #752253;
}

.wpestate_marker.condos.entire-home:before{
border-top: 10px solid #752253;
}

.wpestate_marker.dorm.entire-home{
background: #752253;
}

.wpestate_marker.dorm.entire-home{
border-top: 4px solid #752253;
}

.wpestate_marker.dorm.entire-home:before{
border-top: 10px solid #752253;
}

.wpestate_marker.house.entire-home{
background: #752253;
}

.wpestate_marker.house.entire-home{
border-top: 4px solid #752253;
}

.wpestate_marker.house.entire-home:before{
border-top: 10px solid #752253;
}

.wpestate_marker.villa.private-room{
background: #f7bf33;
}

.wpestate_marker.villa.private-room{
border-top: 4px solid #f7bf33;
}

.wpestate_marker.villa.private-room:before{
border-top: 10px solid #f7bf33;
}

.wpestate_marker.cabin.private-room{
background: #f7bf33;
}

.wpestate_marker.cabin.private-room{
border-top: 4px solid #f7bf33;
}

.wpestate_marker.cabin.private-room:before{
border-top: 10px solid #f7bf33;
}

.wpestate_marker.apartment.private-room{
background: #f7bf33;
}

.wpestate_marker.apartment.private-room{
border-top: 4px solid #f7bf33;
}

.wpestate_marker.apartment.private-room:before{
border-top: 10px solid #f7bf33;
}

.wpestate_marker.condos.private-room{
background: #f7bf33;
}

.wpestate_marker.condos.private-room{
border-top: 4px solid #f7bf33;
}

.wpestate_marker.condos.private-room:before{
border-top: 10px solid #f7bf33;
}

.wpestate_marker.dorm.private-room{
background: #f7bf33;
}

.wpestate_marker.dorm.private-room{
border-top: 4px solid #f7bf33;
}

.wpestate_marker.dorm.private-room:before{
border-top: 10px solid #f7bf33;
}

.wpestate_marker.house.private-room{
background: #f7bf33;
}

.wpestate_marker.house.private-room{
border-top: 4px solid #f7bf33;
}

.wpestate_marker.house.private-room:before{
border-top: 10px solid #f7bf33;
}

.wpestate_marker.villa.shared-room{
background: #62bf5f;
}

.wpestate_marker.villa.shared-room{
border-top: 4px solid #62bf5f;
}

.wpestate_marker.villa.shared-room:before{
border-top: 10px solid #62bf5f;
}

.wpestate_marker.cabin.shared-room{
background: #62bf5f;
}

.wpestate_marker.cabin.shared-room{
border-top: 4px solid #62bf5f;
}

.wpestate_marker.cabin.shared-room:before{
border-top: 10px solid #62bf5f;
}

.wpestate_marker.apartment.shared-room{
background: #62bf5f;
}

.wpestate_marker.apartment.shared-room{
border-top: 4px solid #62bf5f;
}

.wpestate_marker.apartment.shared-room:before{
border-top: 10px solid #62bf5f;
}

.wpestate_marker.condos.shared-room{
background: #62bf5f;
}

.wpestate_marker.condos.shared-room{
border-top: 4px solid #62bf5f;
}

.wpestate_marker.condos.shared-room:before{
border-top: 10px solid #62bf5f;
}

.wpestate_marker.dorm.shared-room{
background: #62bf5f;
}

.wpestate_marker.dorm.shared-room{
border-top: 4px solid #62bf5f;
}

.wpestate_marker.dorm.shared-room:before{
border-top: 10px solid #62bf5f;
}

.wpestate_marker.house.shared-room{
background: #62bf5f;
}

.wpestate_marker.house.shared-room{
border-top: 4px solid #62bf5f;
}

.wpestate_marker.house.shared-room:before{
border-top: 10px solid #62bf5f;
}

.hover_z_pin{
    background-color: #e74264!important;
    color: #ffffff!important;
}

.hover_z_pin:before{
    border-top: 6px solid #e74264!important;
}