Rentvine

Rentvine Plugin Setup

  • Go to: Plugins —> Add Plugin —> Select "Rentvine" from the dropdown --> Click Create
  • URL: cityname-homes-for-rent
  • Template: usually will be "rentals" on newer sites
    • You may need to create a new template and copy from a website template
  • Title Tag:
    • Atlanta Homes for Rent, Houses for Rent in Atlanta, GA, Atlanta, Georgia Rental Homes.
  • Meta Tag:
    • Find Atlanta, GA homes for rent with our borderless search. Search by any criteria!
  • Filters: see below
  • Add the CSS to the bottom of the styles.css file & update colors to reflect the customer's brand colors
  • Add Open Graph to the template in the head if needed

Rentvine Widget Setup

  • Add the following code to the Rentvine list and detail template in Atom:
    • Open the site in Atom --> _system --> Plugins --> Rentvine

List

					    
					        
							
							<header class="rvw-header">
								<h1 class="display-1">{% snippet name='areas' market='1' %} Homes For Rent</h1>
								<div class="btn-list">
									<a href="{% snippet name='portal' type='app' %}" target="_blank" title='opens in new tab' class="btn btn--accent">Apply Online</a>
									<a href="/tenants" class="btn btn--primary">Rental Qualifications</a>
								</div>
							</header>



							<p class="mw-950 text-center">
								Whether you're relocating,
								planning a long-term stay, or simply prefer the flexibility of renting, our extensive listings offer a diverse range of quality homes available
								for extended periods. We understand that finding the right long-term rental is a significant decision, and that's why our search page provides
								a user-friendly interface, advanced filtering options, and comprehensive property details to streamline your search process. Take your time,
								explore our listings, and discover a place where comfort, convenience, and long-lasting memories await you. Start your journey towards finding
								the ideal {% snippet name='areas' market='1' %} rental property today!
							</p>

							<div id="rentvine-property-list-view" class="rentvine-widget property-list">
								{% rentvine_plugin %}
								<form id="rentvine-search-form" class="prop-search-form" _lpchecked="1">
									<div class="prop-search-form__container">
										<div class="prop-search-form__item prop-search-form__item--search">
											<div class="prop-search-form__icon">
												<div class="icon"><i aria-hidden="true" class="fa-kit fa-nhvl-location"></i></div>
											</div>
											<div class="prop-search-form__field">
												{% capture searchInput %}{% rentvine_searchKeyword %}{% endcapture %}
												{{ searchInput | replace: 'Search', 'Search by Location' | replace: 'name="search"', 'name="search" placeholder="Address, city, state, or zip"' }}
											</div>
										</div>


													<div class="prop-search-form__item">
														<div class="prop-search-form__icon">
															<div class="icon"><i aria-hidden="true" class="fa-kit fa-nhw-property"></i></div>
														</div>
														<div class="prop-search-form__field">
															{% capture propTypeInput %}{% rentvine_searchPropertyTypes %}{% endcapture %}
															{{ propTypeInput | replace: 'Property Type', 'Type of Place' }}
														</div>
													</div>

													<div class="prop-search-form__item prop-search-form__item--beds">
														<div class="prop-search-form__icon">
															<div class="icon"><i aria-hidden="true" class="fa-kit fa-nhvl-king-bed"></i></div>
														</div>
														<div class="prop-search-form__field" data-target="dropdown">
															<div class="prop-search-form__label">Beds & Baths</div>
															<div class="prop-search-form__value">Choose amounts</div>
														</div>
														<div class="prop-search__dropdown">
															{% rentvine_searchBeds %}
															{% rentvine_searchBaths %}
														</div>
													</div>

													<div class="prop-search-form__item prop-search-form__item--price">
														<div class="prop-search-form__icon">
															<div class="icon"><i aria-hidden="true" class="fa-kit fa-nhw-price"></i></div>
														</div>
														<div class="prop-search-form__field" data-target="dropdown">
															<div class="prop-search-form__label">Price Range</div>
															<div class="prop-search-form__value">Choose amounts</div>
														</div>
														<div class="prop-search__dropdown">
															{% capture searchMinRent %}{% rentvine_searchMinRent  %}{% endcapture %}
															{{ searchMinRent | replace: 'Minimum Rent', 'Min Rent' }}

															{% capture searchMaxRent %}{% rentvine_searchMaxRent  %}{% endcapture %}
															{{ searchMaxRent | replace: 'Maximum Rent', 'Max Rent' }}
														</div>
													</div>

													<div class="prop-search-form__btn">
														<label for="nesthub-search-btn"><span class="sr-only">Submit</span></label>
														<button id="nesthub-search-btn">
															<div class="icon"><span class="sr-only">Submit</span><i aria-hidden="true" class="fa-kit fa-nhvl-search"></i></div>
														</button>
													</div>

												</div>

												<div class="prop-search-options">

													<div class="prop-search-options__item">
														<div class="prop-search-options__icon">
															<div class="icon"><i class="fa-light fa-sliders"></i></div>
														</div>
														<div class="prop-search-options__label" data-target="dropdown">
															Optional Filters
														</div>
														<div class="prop-search__dropdown">
															{% rentvine_searchPets %}
														</div>
													</div>

													<div class="prop-search-options__item">
														<div class="prop-search-options__icon">
															<div class="icon"><i class="fa-regular fa-arrow-up-arrow-down"></i></div>
														</div>
														<div class="prop-search-options__label" data-target="dropdown">
															Sort
														</div>
														<div class="prop-search__dropdown">
															{% rentvine_searchSort %}
														</div>
													</div>

												</div>

											</form>


								{% assign listing_count = listings | size %}

								{% if listing_count <= 0 %}
									<div class="rvw__no-listings">
										<h4>No Listings Found!</h4>
									</div>
								{% else %}
								<ul class="rvw-nav rvw-nav-pills rvw-mb-3" id="nesthub-property-list-tab-list" role="tablist">
											<li class="rvw-nav-item">
												<a class="rvw-nav-link rvw-show rvw-active" id="rentvine-property-list-tab" href="#rentvine-property-list" role="tab" aria-controls="rentvine-property-list" aria-selected="true">List</a>
									  		</li>
										  	<li class="rvw-nav-item">
												<a class="rvw-nav-link" id="rentvine-property-map-tab" href="#rentvine-property-map" role="tab" aria-controls="rentvine-property-map" aria-selected="false">Map</a>
										  	</li>
										</ul>
										<div class="rvw-tab-content" id="rentvine-property-list-tab-content">
								  			<div class="rvw-tab-pane rvw-fade rvw-active" id="rentvine-property-list" role="tabpanel" aria-labelledby="rentvine-property-list-tab">
												<div class="rvw-list">
													{% for listing in listings %}
													<div class="rvw-list__item">
														<a href="{% rentvine_listingUrl %}" data-id="{{ listing.listing.propertyListingID }}">
															<div class="rvw-list__image">
																{% if listing.image != blank %}
																		<img data-src="{{ listing.image | getListingImageUrl: 'small' }}" alt="{{ listing.unit.address }} {{ listing.unit.address2 }}, {{ listing.unit.city }}, {{ listing.unit.state }} {{ listing.unit.postalCode }}" class="lazyload" />
																		{% if listing.listing.virtualTour %}
																			<div class="rvw-card-video-tour"><img src="{% rentvine_videoTourIconUrl %}" alt="Virtual Tour" /></div>
																		{% endif %}
																{% else %}
																	<img data-src="https://pmi-resources.nesthub.com/images/photo-gallery-placeholder.jpg" alt="{{ listing.headline }}" class="lazyload" />
																{% endif %}
															</div>
															<div class="rvw-list__price">
																{{ listing.unit.rent | money | replace: '.00', '' }}/mo.
															</div>
															<div class="rvw-list__details">
																<ul>
																	<li>
																		{% if listing.unit.beds == 0 %}
																		Studio
																		{% else %}
																		{% if listing.unit.beds == 1 %}Bed{%else%}Beds{%endif%}: {{ listing.unit.beds }}
																		{% endif %}
																	</li>
																	<li class="rvw-icon-list-item">
																		{% if listing.unit.baths == 1 %}Bath{%else%}Baths{%endif%}: {{ listing.unit.baths | replace: '.00', '' }}
																	</li>
																	{% if listing.listing.size %}
																	<li class="rvw-icon-list-item">
																		sqft: {{ listing.listing.size }}
																	</li>
																	{% endif %}
																</ul>
															</div>
															<div class="rvw-list__location">
																{{ listing.unit.address }}{% if listing.unit.address2 %}, {{ listing.unit.address2 }}{% endif %}, {{ listing.unit.city }}, {{ listing.unit.state }} {{ listing.unit.postalCode | split: '-' | first }}
															</div>
															<div class="rvw-list__prop-type">
																{{ listing.property.propertyTypeID | propertyType }}
															</div>
															<div class="rvw-list__availability">
																Available: {{ listing.listing.availabilityDate | availabilityDate }}
															</div>
														</a>
													</div>

													{% endfor %}
												</div>
												<div class="rvw-pagination">
													{% rentvine_pagination %}
												</div>
											</div>
											<div class="rvw-tab-pane rvw-fade" id="rentvine-property-map" role="tabpanel" aria-labelledby="rentvine-property-map-tab">
												<div id="rentvine-property-map-panel" style="height:700px;" data-lat="{{map.latitude}}" data-lng="{{map.longitude}}"></div>
											</div>
										</div>
										{% endif %}
									</div>




									<script type="text/javascript">
										function closeDropdown(item) {
											item.slideUp().removeClass('open');
										}

										function openDropdown(item) {
											item.slideDown().addClass('open');
										}
										$('[data-target="dropdown"]').click(function(e) {
											e.preventDefault();
											var dropdown = $(this).siblings('.prop-search__dropdown');
											if (dropdown.hasClass('open') == true) {
												closeDropdown(dropdown)
											} else {
												$('.prop-search__dropdown.open').slideUp().removeClass('open');
												openDropdown(dropdown)
											}
										});

										$('.prop-search-form__item, .prop-search-option__item').mouseleave(function() {
											setTimeout(() => {
												closeDropdown($('.prop-search__dropdown.open'));
											}, 300);
										});


										function updateFields() {
											var bedValue = beds > 0 ? beds + ' bed, ' : '';
											var bathValue = baths > 0 ? baths + ' bath' : '';
											$('.prop-search-form__item--beds .prop-search-form__value').text(bedValue + bathValue)
											$('.prop-search-form__item--price .prop-search-form__value').text(rentMin + ' - ' + rentMax)
										}

										// Update Search Placeholders on Page Load
										if ( location.search.length > 0 ) {
											var beds = location.search.split('&bedsMin=')[1].split('&')[0];
											var baths = location.search.split('&bathsMin=')[1].split('&')[0];
											var rentMin = '$' + location.search.split('&rentMin=')[1].split('&')[0];
											var rentMax = '$' + location.search.split('&rentMax=')[1].split('&')[0];

											updateFields();
										}

										// Update Search Placeholer Text on Input Change
										$('.prop-search-form__item input, .prop-search-form__item select').on('change keydown paste input', function(){
												beds = $('#rentvine-prop-search-beds').val();
												baths = $('#rentvine-prop-search-baths').val();
												rentMin = '$' + $('#rentvine-prop-search-min-rent').val();
												rentMax = '$' + $('#rentvine-prop-search-max-rent').val();
												updateFields(beds, baths, rentMin, rentMax);
											if ($(this).parent('.prop-search-form__item').children('.prop-search-form__value').text().length == 0) {
												$(this).parent('.prop-search-form__item').children('.prop-search-form__value').text('Choose amounts')
											}
										});

										$( document ).ready(function() {
											// Init Image Carousel
											$('.f-carousel').each(function(){
												const container = document.getElementById($(this).attr('id'));
												const options = {
													Navigation: {
														nextTpl: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" tabindex="-1"><path d="M9 3l9 9-9 9"/></svg>',
														prevTpl: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" tabindex="-1"><path d="M15 3l-9 9 9 9"/></svg>',
													},
													Dots: false,
												};
												new Carousel(container, options);
											})
										});




									</script>
							
					    
					    
					  

Detail

					    
					        
							
							<script type="application/ld+json">
								{
									"@context": "https://schema.org/",
									"@type": "RealEstateListing",
									"name": "{{ listing.headline }}",
									"image": {
										"@type": "ImageObject",
										"url": "{{ images[0].large }}"
									}
								}
							</script>
							<script type="application/ld+json">
								{
									"@context": "https://schema.org/",
									"@type": "Place",
									"address": {
										"@type": "PostalAddress",
										"addressLocality": "{{ unit.city }}",
										"addressRegion": "{{ unit.stateID }}",
										"postalCode": "{{ unit.postalCode }}",
										"streetAddress": "{{ unit.address }} {{ unit.address2 }}"
									},
									"petsAllowed":"{{ listing.petDescription }}",
									"tourBookingPage": "",
									"smokingAllowed": "{{ listing.acceptSmoking }}",
									"description": "{{ listing.description | strip_html }}",
									"url": "{{ plugin.url }}"
								}
							</script>
							<script type="application/ld+json">
								{
									"@context": "https://schema.org/",
									"@type": "Accommodation",
									"numberOfBedrooms": "{{ unit.beds }}",
									"numberOfBathroomsTotal": "{{ unit.fullBaths }} full baths, {{ unit.halfBaths }} half baths",
									"leaseLength": "{{ listing.leaseDescription }}",
									"accommodationCategory": "{{ property.propertyTypeID | propertyType }}"
								}
							</script>
							<script type="application/ld+json">
								{
									"@context": "https://schema.org/",
									"@type": "RentAction",
									"priceSpecification":
									{
										"@type": "UnitPriceSpecification",
										"price": "{{ unit.rent | money }}",
										"priceCurrency": "USD",
										"name": "Monthly Rent",
										"referenceQuantity": {
											"@type": "QuantitativeValue",
											"value": "1",
											"unitCode": "MON"
										}
									}
								}
							</script>

							<div class="rentvine-widget">
								<div id="nesthub-property-detail-view" class="rvw-details">
									{% rentvine_plugin %}
									{% assign virtualTourType = listing | getVirtualTourType %}
									{% if leadSent %}
									<div class="rvw-alert rvw-alert-success" role="alert">
										Message has been sent!
									</div>
									{% endif %}

									<section class="rvw-details__header">
										<header class="text-center">
											<h1>{{ unit.address }}</h1>
											<h2>{{ unit.city }}, {{ unit.stateID }} {{ unit.postalCode | split: '-' | first }}</h2>
										</header>
										<div class="rvw-back-btn">
											<a href="/{{plugin.url}}"><i class="fa-regular fa-circle-chevron-left"></i> Back to search</a>
										</div>
									</section>

									{% assign imageCount = images | size %}
									{% if imageCount > 0 %}

									<section class="rvw-details__gallery">

										<div class="image-container image-container--primary">
											{% for image in images limit: 1 %}
											<div class="image-preview">
												<a id="rvw-listing-detail-primary-image-link" data-fancybox="gallery" href="{{ images[0].large }}">
													<img class="lazyload" data-src="{{ images[0].large }}" alt="View Full Image"/>
												</a>
											</div>
											{% endfor %}
										</div>
										{% if images.size > 1 %}
										<div class="image-container image-container--secondary">
											{% for image in images offset: 1 limit: 4 %}
											<div class="image-preview">
												<a id="rvw-listing-detail-primary-image-link" data-fancybox="gallery" href="{{ image.imageUrl.large }}">
													<img class="lazyload" data-src="{{ image.imageUrl.small }}" alt="View Full Image" />
												</a>
											</div>
											{% endfor %}
										</div>
										{% endif %}

										{% if images.size > 5 %}
										<div class="rvw-listing-detail-view-gallery">
											<i class="fa-regular fa-square-plus"></i> Full Gallery
										</div>
										{% endif %}

										{% if images.size > 5 %}
										<div class="additional-images">
											{% assign imageCount = images.size | minus: 1 %}
											{% for i in (5..imageCount) %}
											<a data-fancybox="gallery" href="{{ images[i].imageUrl.large }}">
												<img data-src="{{ images[i].imageUrl.large }}" alt="View Full Size" class="lazyload" />
											</a>
											{% endfor %}
										</div>
										{% endif %}

										{% if listing.virtualTour  %}
											{% if virtualTourType == 'youtube' %}
											<a class="rvw-listing-detail-view-video" data-fancybox="gallery" href="https://www.youtube.com/embed/{{ listing | getVirtualTourVideoID }}">
											{% elsif virtualTourType == 'vimeo' %}
											<a class="rvw-listing-detail-view-video" data-fancybox="gallery" href="https://vimeo.com/{{ listing | getVirtualTourVideoID }}?title=0&amp;byline=0&amp;portrait=0">
											{% else %}
											<a class="rvw-listing-detail-view-video" href="{{ listing.virtualTour }}" target="_blank">
											{% endif %}
											<i class="fa-sharp fa-regular fa-video-plus"></i> Video Tour
											</a>
											{% endif %}



									</section>
									{% endif %}
									<section class="rvw-details__share">
										<div class="social-icons">
											<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
												<a title="opens in new window" class="a2a_dd" href="https://www.addtoany.com/share"><i class="fa-regular fa-arrow-up-from-bracket"></i> Share</a>
											</div>
										</div>
									</section>
									<section class="rvw-details__content">

										<div class="rvw-details__property-info">

											<h3 class="rvw-details__heading mt-0">Property Details</h3>
											<div class="key-details">
												<div class="key-detail price">
													<span class="value">{{ unit.rent | money }}</span>
													<span class="label">USD / Month</span>
												</div>
												<div class="key-detail bedrooms">
													<span class="value">
														{% if unit.beds == 0 %}
														Studio
														{% else %}
														{{ unit.beds }} {% if unit.beds == 1 %}Bed{%else%}Beds{%endif%}
														{% endif %}
													</span>
													<span class="label">Beds</span>
												</div>
												<div class="key-detail bathrooms">
													<span class="value">{{ unit.baths }}</span>
													<span class="label">{% if unit.baths == 1 %}Bath{%else%}Baths{%endif%}</span>
												</div>
												{% if unit.size %}
												<div class="key-detail sqft">
													<span class="value">
														{{ unit.size }}
													</span>
													<span class="label">sqft</span>
												</div>
												{% endif %}
												<div class="key-detail rent">
													<span class="value">•</span>
													<span class="label">For Rent</span>
												</div>
											</div>

											<hr/>

											<div class="sub-details">
												<div class="sub-detail">
													<span class="sub-detail__label">Building Type:</span>
													<span class="sub-detail__value">{{ property.propertyTypeID | propertyType | replace: ' Home', '' }}</span>
												</div>
												{% if unit.deposit %}
												<div class="sub-detail">
													<span class="sub-detail__label">Deposit:</span>
													<span class="sub-detail__value">{{ unit.deposit | money }}</span>
												</div>
												{% endif %}
												{% if listing.petDescription or listing.acceptDogs or listing.acceptCats %}
												<div class="sub-detail">
													<span class="sub-detail__label">Pets:</span>
													<span class="sub-detail__value">
														{% if listing.acceptDogs == 1 or listing.acceptCats == 1 %}
														Yes
														{% else %}
														No
														{% endif %}
													</span>
												</div>
												{% endif %}
												<div class="sub-detail">
													<span class="sub-detail__label">Date Available:</span>
													<span class="sub-detail__value">
														{{ listing.availabilityDate | availabilityDate }}
													</span>
												</div>
												{% if listing.applicationFee %}
												<div class="sub-detail">
													<span class="sub-detail__label">App Fee:</span>
													<span class="sub-detail__value">{{ listing.applicationFee | money | replace: '.00', '' }}</span>
												</div>
												{% endif %}
												{% if listing.acceptDogs == 1 or listing.acceptCats == 1 %}
												<div class="sub-detail">
													<span class="sub-detail__label">Pet Type:</span>
													<span class="sub-detail__value">
														{% capture petsAllowed %}
														{% if listing.acceptDogs == 1 %}
														Dogs
														{% endif %}
														{% if listing.acceptDogs == 1 and listing.acceptCats == 1 %},{% endif %}
														{% if listing.acceptCats == 1 %}
														Cats
														{% endif %}
														{% endcapture %}
														{{ petsAllowed | strip_newlines | replace: '	', '' | replace: ',', ', ' }}
													</span>
												</div>
												{% endif %}
											</div>

											<div class="headline">
												{{ listing.headline }}
											</div>
											<div class="description">
												{% if virtualTourType  %}
												<div class="video-wrapper">
													{% if virtualTourType == 'youtube' %}
													<iframe src="https://www.youtube.com/embed/{{ listing | getVirtualTourVideoID }}"></iframe>
													{% elsif virtualTourType == 'vimeo' %}
													<iframe src="https://player.vimeo.com/video/{{ listing | getVirtualTourVideoID }}?title=0&amp;byline=0&amp;portrait=0"></iframe>
													{% endif %}
												</div>
												{% endif %}
												{{ listing.description | newline_to_br }}
											</div>

											{% if features.size > 0 %}
											<h3 class="rvw-details__heading">Features and Amenities</h3>
											<div class="features">
											{% for featureCategory in features %}
												<h5 class="mt-4 mb-3">{{ featureCategory.categoryName }}</h5>
												<ul class="dots">
													{% for feature in featureCategory.features %}
													<li>{{ feature }}</li>
													{% endfor %}
												</ul>
											{% endfor %}
											</div>
											{% endif %}
										</div>

										<div class="rvw-details__contact-info">
											<div class="rvw-details__form-container">
												<div class="rvw-details__links">
													<div class="btn-list">
														{% if listing.applicationUrl %}
														<a href="{{ listing.applicationUrl }}" target="_blank" class="btn btn--accent">Apply Online</a>
														{% endif %}
														<a href="/tenants" target="_blank" class="btn btn--primary">Rental Qualifications</a>
														{% if listing.showingUrl %}
														<a href="{{ listing.showingUrl }}" target="_blank" class="btn btn--dark">Schedule Viewing</a>
														{% endif %}
													</div>
												</div>
												<div class="rvw-form-header text-center">
													<h3>Questions? Contact Us!</h3>
													<ul class="list-unstyled">
														<li>phone: <a href="tel:{{ listing.phone }}">{{ listing.phone | phone }}</a></li>
													</ul>
												</div>
												<div class="rvw-details__form">
												<form id="nesthub-property-lead-form" class="rvw-form" method="POST">
													<div class="rvw-form-group">
														{% listing_leadName %}
													</div>
													<div class="rvw-form-group">
														{% listing_leadEmail %}
													</div>
													<div class="rvw-form-group">
														{% listing_leadPhone %}
													</div>
													<div class="rvw-form-group rvw-form-group-textarea">
														{% listing_leadMessage %}
													</div>
													{% listing_nonce %}
													{% listing_honeypot %}
													<button type="submit" class="rvw-btn rvw-btn-primary rvw-btn-block">Submit</button>
												</form>
											</div>
										</div>

										<div class="rvw-details__location">
											<h3 class="rvw-details__heading">Location</h3>
											{% capture mapAddress %}{{ unit.address }},+{{ unit.city }},+{{ unit.stateID }}+{{ unit.postalCode | split: '-' | first }}{% endcapture %}
											<div class="rvw-details__map-container">
												<div data-fancybox="map" data-src="https://www.google.com/maps/search/{{ mapAddress | replace: ' ', '+' | replace: '#', '' | replace: '.', '' |  urlencode }}/@{{ unit.latitude }},{{ unit.longitude }},14z" id="rvw-listing-detail-map-container" data-latitude="{{ unit.latitude }}" data-longitude="{{ unit.longitude }}"></div>
											</div>
										</div>

									</div>

								</section>



							</div>
							</div>


							<script type="text/javascript">
							// Floating Form Labels
							$('.rvw-form-control').on('change keydown paste input', function(){
								if ($(this).val().length > 0) {
									$(this).parent('.rvw-form-group:not(.rvw-form-group-checkbox):not(.rvw-form-group-radio):not(.rvw-form-group-textarea)').children('label').addClass('float-label')
								} else (
									$(this).parent('.rvw-form-group:not(.rvw-form-group-checkbox):not(.rvw-form-group-radio):not(.rvw-form-group-textarea)').children('label').removeClass('float-label')
								)
							});

							$(document).ready(function () {
								mapboxgl.accessToken =
									"pk.eyJ1Ijoia29odmEiLCJhIjoiY2prbDlsNXhuMXl6YzNxbnhtY2w0NzB3bSJ9.jpQllFfzX4I6lT3VF6ZByQ";

								const container = $("#rvw-listing-detail-map-container");

								const lat = container.data("latitude") || 0.0;
								const lng = container.data("longitude") || 0.0;
								const zoom = container.data("zoom") || 8;

								const map = new mapboxgl.Map({
									container: "rvw-listing-detail-map-container",
									style: "mapbox://styles/mapbox/streets-v12", // style URL
									center: [lng, lat], // starting position [lng, lat]
									zoom: zoom, // starting zoom
								});

								const marker = new mapboxgl.Marker().setLngLat([lng, lat]).addTo(map);

								Fancybox.bind('[data-fancybox="gallery"]', {});

								Fancybox.bind('[data-fancybox="map"]', {});

								$(".rvw-listing-detail-view-gallery").on("click", function () {
									Fancybox.fromSelector('[data-fancybox="gallery"]');
								});

							});
							</script>
							
					    
					    
					  

If on older sites, add the following code to the head of the rentals template:

Rentals

					
							
						
							<!-- Add to the head tag  -->
							<link rel="stylesheet" href="https://resources.nesthub.com/css/fancybox.css" />
							<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/carousel/carousel.css" />
							<link rel="stylesheet" href="https://api.mapbox.com/mapbox-gl-js/v2.13.0/mapbox-gl.css">
							<link rel="stylesheet" href="https://resources.nesthub.com/css/nhw.css">
							<script defer src="https://kit.fontawesome.com/9e4e3329f0.js" crossorigin="anonymous"></script>
							<script src="https://resources.nesthub.com/js/fancybox.umd.js"></script>
							<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/carousel/carousel.umd.js"></script>
							<script src="https://api.mapbox.com/mapbox-gl-js/v2.13.0/mapbox-gl.js"></script>
							<script src="https://static.addtoany.com/menu/page.js"></script>
						
					
					
				

Home Page Widgets

    

        
		<div class="rentvine_home rentvine_widget" data-subdomain="123pm" data-component="listings"></div>

		<script type="text/javascript">
			(function(d, s, id) {
				if (d.getElementById(id)) return;
				var t = (new Date()).getTime();
				var js = d.createElement(s);
				js.id = id;
				js.src = "https://app.rentvine.com/public/widget/init.js?_=" + t;
				d.body.appendChild(js);
			}(document, 'script', 'rv-jsinit'));
		</script>
		<script type="text/javascript">
			if (location.search.length > 0) {
				var url = '/market-homes-for-rent';
				var property = location.search;
				window.location = url + property;
			};
		</script>
    

    
  

Listings Example:

			
				
	.rentvine_widget .listings-search-form {display: none;}
		
			
		

Homepage Rentals Listing

			
				
		.rentvine_widget .listings-search-form {display: none;}
		.rentvine_home .rv-widget > form { display: none; }
		.rentvine_home .rv-widget .row { justify-content: center; }
		.rentvine_home .rv-widget .empty-listings { text-align: center; }
		.rentvine_home .rv-widget .nav-tabs { display: none; }
		.rentvine_home .rv-widget .listings-container { height: 100%; }
		.rentvine_home .rv-widget .listing-card { background-color: #f2f2f2; border-color: var(--border-color); height: 100%; }
		.rentvine_home .rv-widget .listings-amount { display: flex; align-items: center; font-size: 20px; color: var(--primary); }
		.rentvine_home .rv-widget .listing-rent-amount { color: inherit; }
		.rentvine_home .rv-widget .listing-rent-frequency { padding-left: 10px; color: inherit; font-size: 85%; font-weight: bold; }
		.rentvine_home .rv-widget .listings-container .listing-card .row:has(.listings-card-body) { height: 100%; }
		.rentvine_home .rv-widget .listings-container .listing-card .listings-card-body { display: flex; flex-direction: column; height: 100%; }
		.rentvine_home .rv-widget .listings-container .listing-card .listings-card-body .listings-details { display: flex; flex-direction: column; height: 100%; }
		.rentvine_home .rv-widget .listings-details div:has(.listings-view-details.btn) { margin-top: auto; }
		.rentvine_home .rv-widget .listings-container .listing-card .listings-card-body .listings-details .listings-view-details { overflow-x: hidden; border-radius: 0; }
		/* Display Only 3 Properties */
		.rentvine_home .col-md-4:has(.listings-container):nth-child(1n+4) { display: none; }

		@media (min-width: 768px) {
			.rentvine_home .rv-widget .col-md-4 { flex: 1 0 50%; max-width: 50%; }
		}
		@media (min-width: 1200px) {
			.rentvine_home .rv-widget .col-md-4 { flex: 1 0 33%; max-width: 33%; }
		}
		
			
		

Homepage Rentals Listings Example:

Map Only Example:

			
				
		.rentvine-map .rv-widget > *:not(.tab-content) { display: none; }
		.rentvine-map .rv-widget .tab-pane { display: none!important; }
		.rentvine-map .rv-widget .tab-pane:last-child { display: block!important; }
		
			
		
			
				
				
					<div class="rentvine-map">
						<div class="rentvine_widget" data-subdomain="123pm" data-component="listings"></div>
					</div>

					<script type="text/javascript">
						(function(d, s, id) {
							if (d.getElementById(id)) return;
							var t = (new Date()).getTime();
							var js = d.createElement(s);
							js.id = id;
							js.src = "https://app.rentvine.com/public/widget/init.js?_=" + t;
							d.body.appendChild(js);
						}(document, 'script', 'rv-jsinit'));
					</script>
					
			
		

Add the following JS to redirect to the main rentvine properties page. Replace the url with the renvine properties page url.

			
				
				
				<script type="text/javascript">
					if (location.search.length > 0) {
						var url = 'https://123pm.nesthub.com/market-homes-for-rent';
						var property = location.search;
						window.location = url + property;
					};
				</script>
				
			
		

Open Graph to Add to Template:

    
        
			<meta property="og:title" content="" />
			<meta property="og:type" content="website" />
			<meta property="og:image" content="" />
			<meta property="og:description" content="" />
			<meta property="og:image:width" content="763px">
			<meta property="og:image:height" content="900px">
			<meta property="og:image:alt" content="" />
    
    
  

CSS to Add to End of styles.css File:

	
			
	/* ==========================================================================
	   Rentvine Properties Widget
	============================================================================= */

	/* Set Design Standards & Colors Here */
	:root {
		--primary-light: var(--primary);
		--secondary-light:  var(--secondary);
		--accent: var(--light);
		--box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
	}

	#rentals { width: 2000px; max-width: 100%; padding: 120px 5.5vw; margin: 0 auto; }
	@media (max-width:700px) {
	  #rentals { padding: 80px 5.5vw; }
	}

	.rvw .icon { line-height: 1; }
	.rvw .icon svg > * { fill: currentColor; }
	.fa-rvw-location { font-size: 30px; }
	.fa-rvw-calendar { font-size: 23px; }
	.fa-rvw-user { font-size: 28px; }
	.fa-rvw-search { font-size: 25px; }
	.rvw__no-listings { padding: 80px 0; text-align: center; }
	.mapboxgl-marker svg path[fill*='#3FB1CE'] { fill: var(--dark)!important; }
	select { -webkit-appearance: initial; }
	.f-carousel__viewport.is-draggable { cursor: pointer!important; }

	/* List
	============================================================================= */

	/* Header */
	.rvw-header { text-align: center; position: relative; margin-bottom: 55px; }
	.rvw-header .display-1 { margin-bottom: 45px!important; }
	@media (min-width: 1451px) {
	  .rvw { padding-top: 60px!important; }
	  .rvw-header { padding-top: 65px; }
	  .rvw-header .display-1 { width: 775px; max-width: 100%; margin: 0 auto!important; }
	  .rvw-header .btn-list { position: absolute; right: 0; top: 0; flex-direction: column; }
	}
	@media (max-width: 992px) {
	  .rvw-header .btn-list { justify-content: center; }
	}

	/* Search Form */
	.prop-search-form { background: none!important; padding: 0!important; }
	.prop-search-form__container { display: flex; background-color: #ffffff; height:78px; border-radius: 35px; padding: 15px; cursor: pointer; max-width: 1062px; margin: 0 auto; -webkit-user-select: none; 	-ms-user-select: none; user-select: none; margin: 55px auto 85px; box-shadow: 0px 2px 50px 0px rgba(0, 0, 0, 0.15); }
	.prop-search-form__item { position: relative; display: flex; vertical-align: middle; align-items: center; padding: 0px 24px; flex-grow: 1; }
	.prop-search-form__item--search { flex-grow: 1; padding-left: 10px; }
	.prop-search-form__icon { flex-grow: 0; display: flex; align-items: center; justify-content: center; padding-bottom: 7px; }
	.prop-search-form__icon .icon { min-width: 30px; height: 30px; color: var(--primary); font-size: 30px; line-height: 1; display: flex; align-items: center; justify-content: center; margin: auto; }
	.prop-search-form__field { padding-left: 10px; position: relative; flex-grow: 1; }
	.prop-search-form__field label, .prop-search-form__label, .prop-search__dropdown label { font-size: 16px; line-height: 1; color: var(--body-text); font-weight: bold; letter-spacing: .05em; margin: 0; }
	.prop-search-form__field input, .prop-search-form__field select, .prop-search-form__value, .prop-search-form__placeholder { border: 0; font-size: 15px; color: var(--muted); white-space: nowrap; background: none; height: 20px!important; padding: 0; }
	.prop-search-form__field select { position: relative; left: 0; top: -3px; -webkit-appearance: initial; }
	.prop-search-form__field input { position: relative; top: -2px; z-index: 1; }
	.prop-search-form__placeholder { position: absolute; bottom: 5px; left: 10px; z-index: 0; }
	.prop-search-form__btn { display: flex; align-items: center; }
	.prop-search-form__btn button { background-color: var(--accent); display: flex; align-items: center; justify-content: center; border: none; font-size: 25px; width: 49px; height: 49px; border-radius: 50%; color: #fff; line-height: 56px; text-align: center; transition: .4s; }
	.prop-search-form__btn button:hover { background-color: var(--primary); }
	.prop-search-form__btn .sr-only  { font-size: 0; }
	@media (max-width: 1200px) {
		.prop-search-form__container { height: auto; flex-wrap: wrap; justify-content: center; }
		.prop-search-form__item { padding: 15px; }
		.prop-search-form__item--search { flex: 1 1 100%; border: 0!important; border-bottom: 3px solid #eeefef!important; }
	  .prop-search-form__btn { display: flex; align-items: center; justify-content: center; margin-left: auto; }
	}
	@media (max-width: 500px) {
	  .prop-search-form__container { flex-direction: column; }
	  .prop-search-form__icon .icon { max-width: 30px; }
	  .prop-search-form__icon .fa-nhvl-king-bed { font-size: 20px; }
	}

	/* Search Options */
	.prop-search-options { display: flex; justify-content: center; margin: 30px 0; }
	.prop-search-options a:not(:hover) { color: var(--body-text); }
	.prop-search-options__item { padding: 0 25px; display: flex; align-items: center; position: relative; transition: .05s; }
	.prop-search-options__item:hover { cursor: pointer; color: var(--primary); }
	.prop-search-options__icon { color: var(--primary); font-size: 29px; }
	.prop-search-options__label { font-size: 16px; letter-spacing: .025em; font-weight: bold; padding-left: 10px; }
	@media (max-width: 710px) {
	  .prop-search-options { margin-top: 0; flex-direction: column; text-align: center; }
	  .prop-search-options__item { padding: 15px; }
	}
	/* Search Dropdown */
	.prop-search__dropdown { display: none; background: #fff; text-align: left; padding: 15px; width: 100%; min-width: 280px; border-radius: 20px; position: absolute; top: 100%; left: 15px; box-shadow: 0px 2px 50px 0px rgba(0, 0, 0, 0.15);  z-index: 99; }
	.prop-search__dropdown label ~ label { margin-top: 15px; }
	@media (max-width: 710px) {
	  .prop-search__dropdown { left: 0; right: 0; }
	}

	/** List **/
	.rvw-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 420px)); justify-content: center; grid-gap: 45px 30px; overflow: hidden; }
	.rvw-list:has(.rvw-list__item:nth-child(4)) { grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); }
	.rvw-list a { color: var(--body-text); }
	.rvw-list__item { text-align: center; font-size: 16px; line-height: 1.15; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
	.rvw-list__image { width: 100%; height: 0; padding-top: 69.35%; background-color: #efefef; border-radius: 20px; overflow: hidden; position: relative; }
	.rvw-list__image img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; position: absolute; top: 0; left: 0; }
	.rvw-list__price { letter-spacing: .025em; font-weight: bold; padding-top: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; padding-right: 15px; }
	.rvw-list__location { margin: 10px 0;  }
	.rvw-list__details { margin: 10px 0 8px; }
	.rvw-list__prop-type { font-weight: bold; }
	.rvw-list__availability { margin: 10px 0 0; color: var(--muted); }
	.rvw-list__item ul { list-style-type: none; margin: 0; padding: 0; }
	.rvw-list__item ul li { display: inline-block; padding: 0; margin: 0; padding: 0 10px 0 5px; border-right: 1px solid #555; }
	.rvw-list__item ul li:last-child { border-right: 0; padding-right: 0; }
	.rvw-list__item ul li:first-child { padding-left: 0; }
	#rentvine-property-map-panel { border-radius: 20px; overflow: hidden; }

	/** Pagination **/
	.rvw-pagination { margin-top: 50px; text-align: center; justify-content: center; }
	.rvw-pagination ul { display: flex; justify-content: center; padding-left: 0; list-style: none; margin-top: 20px; }
	.rvw-pagination a { position: relative; display: block; padding: 0.375rem 0.75rem; font-size: 16px; color: var(--secondary); text-decoration: none; background-color: #fff; border: 1px solid var(--gray); transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
	.rvw-pagination a:hover { z-index: 2; color: var(--secondary); background-color: var(--gray); border-color: var(--gray); }
	.rvw-pagination a:focus { z-index: 3; color: #fff; background-color: var(--secondary); outline: 0; box-shadow: var(--box-shadow); }
	.rvw-pagination a.rvw-active, .rvw-active > a, .rvw-page-item.rvw-active .rvw-page-link { z-index: 3; color: #fff; background-color: var(--primary); border-color: var(--primary); }
	.rvw-pagination a.disabled, .disabled > .rvw-pagination a { color: var(--secondary-light); pointer-events: none; background-color: var(--secondary-light); border-color: var(--secondary-light); }
	.rvw-pagination li { margin: 0; }
	.rvw-pagination li:not(:first-child) a { margin-left: calc(1px * -1); }
	.rvw-pagination li:first-child a { border-top-left-radius: 0.375rem; border-bottom-left-radius: 0.375rem; }
	.rvw-pagination li:last-child a { border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem; }
	@media (prefers-reduced-motion: reduce) {
	.rvw-pagination a { transition: none;  }
	}

	/* Carousel */
	.rvw .f-carousel { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
	.rvw .f-carousel__slide { height: 100%; }
	.rvw .f-carousel__nav { transition: 0.4s; }
	.rvw .f-button { height: 39px; width: 39px; background: var(--dark); color: #fff; border-radius: 50%; transition: 0.3s ease-in-out;  }
	.rvw .f-button:hover { background: var(--accent)!important; color: var(--dark)!important; transition: 0.3s ease-in-out; }
	.rvw .image:not(:hover) .f-carousel__nav { opacity: 0; transition: 0.4s; }




	/* Details
	============================================================================= */
	.rvw-details { width: 1475px; max-width: 100%; margin: 0 auto; }

	/** Header **/
	.rvw-details__header { position: relative; }
	.rvw-details__header h1 { }
	.rvw-details__header h2 { margin-bottom: 35px; font-weight: normal; }
	.rvw-back-btn { text-align: right; margin-bottom: 20px; }
	.rvw-back-btn a { display: inline-flex; align-items: center; font-weight: bold; font-size: 16px; letter-spacing: .025em; color: var(--body-text); }
	.rvw-back-btn a i { font-size: 34px; color: var(--primary); margin-right: 12px; transition: 0.4s; }
	.rvw-back-btn a:hover, .rvw-back-btn a:hover i { color: var(--accent); }
	@media (min-width: 1451px) {
	  .rvw-details__header { padding-top: 60px; }
	}
	@media (min-width: 992px) {
		.rvw-back-btn { position: absolute; right: 0; bottom: -20px; }
	}
	@media (max-width: 500px) {
		.rvw-back-btn { text-align: center; }
	}

	/** Primary Image **/
	.rvw-details__gallery { display: flex!important; position: relative; align-items: stretch; min-height: 540px; margin: -10px; padding-bottom: 50px; }
	.rvw-details__gallery .image-preview { position: relative; background-color: #efefef; border-radius: 20px; overflow: hidden;  }
	.rvw-details__gallery .image-container { padding: 10px; }
	.rvw-details__gallery .image-container--primary { flex: 1 1 auto; }
	.rvw-details__gallery .image-container--primary .image-preview { height: 100%; width: 100%; }
	.rvw-details__gallery .image-container--secondary { flex: 0 1 600px; display: flex; flex-wrap: wrap; grid-gap: 20px; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); }
	.rvw-details__gallery .image-container--secondary .image-preview { flex: 1 1 35%; }
	.rvw-details__gallery img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; position: absolute; top: 0; left: 0; transition: .5s cubic-bezier(0,.49,.54,.99); }
	.rvw-details__gallery .image-preview:hover img { transform: scale(1.08); transition: 1.5s cubic-bezier(0,.49,.54,.99);  }
	.rvw-details__gallery .rvw-listing-detail-view-gallery, .rvw-listing-detail-view-video { position: absolute; height: 44px; width: 149px; text-align: center; line-height: 44px; bottom: 70px; right: 20px; background: #fff; display: flex; align-items: center; justify-content: center; font-weight: bold; border-radius: 10px; font-size: 16px; letter-spacing: .05em; cursor: pointer; transition: .4s; color: var(--body-text)!important; }
	.rvw-details__gallery .rvw-listing-detail-view-gallery i, .rvw-listing-detail-view-video i { font-size: 24px; margin-right: 10px; }
	.rvw-details__gallery .rvw-listing-detail-view-gallery:hover, .rvw-listing-detail-view-video:hover { background: var(--accent); transform: scale(1.03);}
	.rvw-details__gallery .rvw-listing-detail-view-gallery:active, .rvw-listing-detail-view-video:active { transform: scale(0.97);}
	.rvw-listing-detail-view-video { bottom: 125px; }
	.rvw-details__gallery .additional-images { display: none;  }
	@media (min-width: 992px) and (max-width: 1330px) {
		.rvw-details__gallery .image-container--secondary { max-width: 50%; }
	}
	@media (max-width: 991px) {
		.rvw-details__gallery { min-height: 61.1vw;  }
		.rvw-details__gallery .image-container--primary { flex: 1 1 100%; }
		.rvw-details__gallery .image-container--secondary { display: none; }
	}

	/* Tabs */
	.rvw-nav-pills .rvw-nav-link.rvw-active, .rvw-nav-pills .rvw-show>.rvw-nav-link { background: var(--primary); }

	/** Social Sharing **/
	.rvw-details__share { text-align: right; margin-bottom: 20px; font-size: 16px; letter-spacing: .05em; }
	.rvw-details__share .social-icons { display: inline-block; }
	.rvw-details__share a:not(:hover) { color: var(--body-text); }

	/** Property Details **/
	.rvw-details__content { }
	.rvw-details__property-info .key-details { display: flex; flex-wrap: wrap; margin: 0 -10px 25px; line-height: 1.1; }
	.rvw-details__property-info .key-detail { flex: 1 1 auto; padding: 10px; }
	.rvw-details__property-info .key-detail .label { font-size: 16px; font-weight: bold; letter-spacing: .05em; padding-left: 5px; white-space: nowrap; }
	.rvw-details__property-info .key-detail .value { font-weight: bold; font-size: 26px; color: var(--accent); }
	.rvw-details__property-info .key-detail.rent .value { position: relative; top: 4px; }
	.rvw-details__property-info hr { border-color: #f1f1f1; border-width: 4px; margin: 30px 0; }
	.rvw-details__property-info .sub-detail { display: flex; align-items: center; }
	.rvw-details__property-info .sub-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); grid-gap: 15px 25px; margin-bottom: 45px; line-height: 1.1; }
	.rvw-details__property-info .sub-detail__label { font-weight: bold; font-size: 16px; letter-spacing: .05em; padding-right: 15px; }
	.rvw-details__property-info .sub-detail__value { font-weight: bold; font-size: 20px; color: var(--primary); letter-spacing: .05em; }
	.rvw-details__property-info .headline { font-weight: bold; }
	/* .rvw-details__property-info .description br + br { display: none; } */
	.rvw-details__property-info .features ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 5px; margin: 0; padding: 0; }
	.rvw-details__property-info .features li { margin: 0; }
	.rvw-details__heading { font-size: 30px; font-weight: bold; letter-spacing: .025em; margin: 40px 0 25px!important; color: var(--body-text); }
	.rvw-details__map-container, #rentvine-property-view-map-panel { border-radius: 20px; overflow: hidden; margin-bottom: 20px; }
	#rvw-listing-detail-map-container { height: 394px; }
	@media (min-width: 992px) {
		.rvw-details__content { display: flex!important; }
		.rvw-details__property-info { padding-right: 5vw; flex-grow: 1; }
	}
	@media (max-width: 500px) {
		.rvw-details__heading { font-size: 24px; }
	  .rvw-details__property-info .key-detail.price { flex: 1 0 100%; }
	}


	/** Contact Info **/
	.rvw-details__contact-info { text-align: center; }
	.rvw-details__form-container { padding: 70px 55px 55px; background: #fff; border-radius: 20px; box-shadow: 0px 2px 50px 0px rgba(0, 0, 0, 0.1); }
	.rvw-details__form-container h3 { font-size: 22px; margin: 0 0 15px; }
	.rvw-details__form-container .btn-list { margin-bottom: 50px; justify-content: center; }
	.rvw-details__form-container .btn-list .btn { min-width: 240px; }
	.rvw-details__form-container form { text-align: left; margin-top: 40px; }
	.rvw-details__form-container form br { display: none; }
	.rvw-details__form-container a:not(:hover) { color: var(--body-text); }
	.rvw-details__form-container input, .rvw-details__form-container textarea { border: 0; border-radius: 0; border-bottom: 1px solid #000; height: 40px; padding-left: 0!important; padding-right: 0!important; }
	.rvw-details__form-container input:focus, .rvw-details__form-container textarea:focus { outline: none; box-shadow: none; }
	.rvw-form-control:focus { border-color: var(--accent); }
	.rvw-details__form-container .rvw-btn { position: relative; padding: 0; background: none!important; border: 0; width: auto; margin-left: auto; padding-right: 65px; font-size: 18px; color: var(--body-text)!important; display: block; line-height: 40px; white-space: nowrap; text-transform: uppercase; font-weight: 600; letter-spacing: .05em; }
	.rvw-details__form-container .rvw-btn::after  { content: '\e000'; color: var(--body-text); font-size: 15px; height: 40px; width: 40px; text-align: center; border-radius: 50%; border: 3px solid var(--primary-light); position: absolute; right: 0; top: 50%; transform: translateY(-50%); transition: .5s; font-family: "Font Awesome Kit"; font-style: normal; font-weight: 400; line-height: 35px; }
	.rvw-details__form-container .rvw-btn:hover { color: var(--accent)!important; }
	.rvw-details__form-container .rvw-btn:hover::after { border-color: var(--accent); transition: .5s; }

	/* Floating Form Labels */
	.rvw-details__form-container .rvw-form .rvw-form-group { position: relative; }
	.rvw-details__form-container .rvw-form .rvw-form-group:not(.rvw-form-group-checkbox):not(.rvw-form-group-radio):not(.rvw-form-group-textarea) label { font-weight: 400; margin: 0; position: absolute; font-size: 16px; bottom: 10px; left: 0; z-index: 2; height: 100%; padding: 1rem 0rem 0; overflow: hidden; text-align: start; text-overflow: ellipsis; white-space: nowrap; pointer-events: none; border: var(--bs-border-width) solid transparent; transform-origin: 0 0; transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; }
	.rvw-details__form-container .rvw-form-group-textarea label { font-weight: 400; margin: 0; font-size: 16px; height: 100%; padding: 0; position: relative!important; }
	.rvw-details__form-container .rvw-form-group ::-webkit-input-placeholder, .rvw-details__form-container .rvw-form-group select:invalid, .rvw-details__form-container .rvw-form-group select:not(:focus) { color: transparent!important; }
	.rvw-details__form-container .rvw-form .rvw-form-group:not(.rvw-form-group-checkbox):not(.rvw-form-group-radio):has(input:focus) label, .rvw-details__form-container .rvw-form .rvw-form-group:has(select:focus) label, .rvw-details__form-container .float-label { transform: translateY(-1em) scale(.8); opacity: .7; }
	.rvw-details__form-container .rvw-form-group-dropdown:has(.float-label) select:not(:focus) { color: var(--body-text)!important; }
	.rvw-details__form-container .rvw-form-group-dropdown label { left: -1px!important; }

	@media (min-width: 992px) {
		.rvw-details__contact-info { flex: 0 0 475px; }
	}
	@media (min-width: 992px) and (max-width: 1330px) {
		.rvw-details__contact-info { max-width: 50%; }
		.rvw-details__form-container { padding: 55px 35px 50px; }
	}
	@media (max-width: 991px) {
		.rvw-details__contact-info { padding-top: 50px; }
	}
	@media (max-width: 550px) {
		.rvw-details__contact-info .heading { flex-direction: column; justify-content: center; text-align: center; }
	  .rvw-details__form-container { padding: 55px 20px 50px; }
	}


	/* Location */
	.rvw-details__location { text-align: left; margin-top: 70px; }


	/* Utilities */
	.mt-0 { margin-top: 0!important; }
	
	

Rentvine Plugin Filters

You can add filters in the backend of the site if you go to edit the plugin and add the following in the JSON filters section

Filter Options
  • propertyGroupIDs
    • This is where the Rentvine client will create a group and apply it to a specific set of properties that will allow us to filter.
      • Go into their Rentvine account and under the settings, click on property groups and then once you select on the property group, you’ll see the property group number in the URL
      • Rentvine Property Group
  • propertyTypeIDs
    • Filtering by Single Family Homes, Apartment, Commercial, Mobile Home, Etc.
  • search
    • Filtering for cities and other text filters

Example:

{ "propertyGroupIDs": "3" }

Example:

{ "propertyTypeIDs": [9] }

Example:

{ "search" : "Kearney" }

Rentvine Property Types:

RV Property Types

Rentvine Syndication:

Syndication List

Rentvine Property Types:

Syndication List