0

I have setup some Structure/Views for items that I am pushing to the front page. I have 2 separate link items (1 displays facebook icon, 1 displays arrow icon) some instances will have both links, some instances will have 1, currently if I leave the facebook link field blank, the display still leaves the space for that item.

It seems related to the font awesome "fas" class that needs to be added to the Views setting in order to load the icons (icons are used in "content:" in css). Once I remove the "fas" class the height of the empty link field removes itself from the page. How do I retain "fas" class on the: View (structures/views/ (item) / link field; but remove the height of empty fields?

code:

<div class="views-field views-field-field-link-special"> 
<div class="field-content readmore fas"> 
<a href="/jjweb/web/node/24" target="_blank">Read More</a> </div></div>
<div class="views-field views-field-field-link-facebook"> 
<div class="field-content readfacebook fas"> </div></div>

The below screenshot shows how the class is applied to the View/Field, with "Hide if Empty" applied.

enter image description here

  • Welcome to the drupal stackexchange, this seems more like a css issue but perhaps if you become more specific of what the html output looks on the page someone can help you solve it. – GiorgosK Dec 17 '18 at 7:08
  • yes it seems to do with the "fas" class that needs to be added to the Views setting in order to load the fontawesome icons correctly (the icons are being referred to as content n the css). Once I remove the "fas" class the height of the empty link field removes itself from the page. – Auxiliary Joel Dec 18 '18 at 1:04
  • See: <div class="field-content readfacebook fas"> that is hidden on page (there is no link used and View is set to hide if empty Field). But "fas" class is still forcing space on the page. If I remove "fas" the space removes from page. How to retain "fas" class,but not the height of empty fields? <div class="views-field views-field-field-link-special"> <div class="field-content readmore fas"> <a href="/jjweb/web/node/24" target="_blank">Read More</a> </div></div><div class="views-field views-field-field-link-facebook"> <div class="field-content readfacebook fas"> </div> – Auxiliary Joel Dec 18 '18 at 1:13
  • please add these details in your question and format any code snippet if possible. The more details you give about your problem the more chances someone will pick it up and answer. – GiorgosK Dec 18 '18 at 5:11
  • Please add more information, content type setup ? how many fields ? names of fields, views setup ? what views fields are outputted ? Drupal 7 or Drupal 8 ? Don't cram ALL information in your question but make an effort to only show relevant info, (intead of the picture just mentioning No results behaviour with hide if empty checked will probably suffice. – GiorgosK Dec 18 '18 at 6:57
0

The cleanest solution would be to hide a field that has no content.

Go into the configuration of each field you output on the view and under No results behaviour check hide if empty

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.