Jump to content


Photo

Show price display more conspicuous


Best Answer Alejandro , 15 April 2018 - 06:26 AM

You can very easily do this with CSS. Below an example thata you will use as a starting point to adjust to your liking

 

2018-04-15_07-20-15.png

/*
The name of the field in 
the example is jr_realestateprice
*/
.jrRealestateprice {
    border: 1px solid #28289c;
    border-radius: 3px;
    padding: 5px 10px;
    display: inline-block;
}
.jrRealestateprice .jrFieldValue,
.jrRealestateprice .jrFieldLabel {
    font-size: 20px;
    color: #28289c;
    font-weight: 600;
}

That applies everywhere where the field is shown. If you want to limit to detail and list pages, you use jrListingDetail and jrListings as parent selectors:

.jrListings .jrRealestateprice,
.jrListingDetail .jrRealestateprice {
	border: 1px solid #28289c;
	border-radius: 3px;
	padding: 5px 10px;
	display: inline-block;
}
.jrListings .jrRealestateprice .jrFieldValue,
.jrListings .jrRealestateprice .jrFieldLabel,
.jrListingDetail .jrRealestateprice .jrFieldValue,
.jrListingDetail .jrRealestateprice .jrFieldLabel {
	font-size: 20px;
	color: #28289c;
	font-weight: 600;
}

Couldn't be easier! :)

Go to the full post


  • Please log in to reply
5 replies to this topic

#1 Bodo Lamprecht

Bodo Lamprecht

    Member

  • Members
  • PipPip
  • 27 posts

Posted 15 April 2018 - 03:37 AM

Hello,
 
I would like to make the price displays more conspicuous. So the price should be at e.g. Classifieds in the overview and also on the detail page are larger, thicker and also displayed in a different color. As in classic classifieds websites.
 
Thank you
Bodo


#2 Alejandro

Alejandro

    Advanced Member

  • Administrators
  • 32504 posts

Posted 15 April 2018 - 06:26 AM   Best Answer

You can very easily do this with CSS. Below an example thata you will use as a starting point to adjust to your liking

 

2018-04-15_07-20-15.png

/*
The name of the field in 
the example is jr_realestateprice
*/
.jrRealestateprice {
    border: 1px solid #28289c;
    border-radius: 3px;
    padding: 5px 10px;
    display: inline-block;
}
.jrRealestateprice .jrFieldValue,
.jrRealestateprice .jrFieldLabel {
    font-size: 20px;
    color: #28289c;
    font-weight: 600;
}

That applies everywhere where the field is shown. If you want to limit to detail and list pages, you use jrListingDetail and jrListings as parent selectors:

.jrListings .jrRealestateprice,
.jrListingDetail .jrRealestateprice {
	border: 1px solid #28289c;
	border-radius: 3px;
	padding: 5px 10px;
	display: inline-block;
}
.jrListings .jrRealestateprice .jrFieldValue,
.jrListings .jrRealestateprice .jrFieldLabel,
.jrListingDetail .jrRealestateprice .jrFieldValue,
.jrListingDetail .jrRealestateprice .jrFieldLabel {
	font-size: 20px;
	color: #28289c;
	font-weight: 600;
}

Couldn't be easier! :)



#3 Bodo Lamprecht

Bodo Lamprecht

    Member

  • Members
  • PipPip
  • 27 posts

Posted 15 April 2018 - 08:35 AM

Thanks, I'll try it.



#4 Bodo Lamprecht

Bodo Lamprecht

    Member

  • Members
  • PipPip
  • 27 posts

Posted 19 April 2018 - 02:36 AM

Which css file do I use for this?



#5 Alejandro

Alejandro

    Advanced Member

  • Administrators
  • 32504 posts

Posted 19 April 2018 - 05:06 AM

Whichever one you prefer. Your template's, JReviews CSS overrides.



#6 Bodo Lamprecht

Bodo Lamprecht

    Member

  • Members
  • PipPip
  • 27 posts

Posted 20 April 2018 - 02:39 AM

Everything okay. I got it. Thank you Alejandro






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users