melinda's blog

I could not find a simple way to do this or at least I couldn't find any instruction in twig docs. 
if is_front == false Did not work.

The below twig did, mind your home page may no be Node 1 like mine is. So change "1" if you need to.

{% if node.id == 1 %}

{% else%}
<div class= "pageheaders"><img src="/images/headerbeach.jpg"/></div>
{% endif %}

OR

{% if node.id != 1 %}
<div class= "pageheaders"><img src="/images/headerbeach.jpg"/></div>

{% else%}

This can be use in a twig template for a view teaser.

<h4 class="title"><a href="{{ url }}" rel="bookmark">{{ node.label }}</a> </h4> 

{{ url }} will create a link to the node associated with the view.

If you need an Image hard code such as a social media icon, but only want to display when a certain link field is filled out.... Here's your twig code.

My link field is field.hudl.url replace it with your link field.

The twig:

<div id="social">
{% if content.field_hudl_link is not empty %}

  <div class = "image"> 
   Zoe
{% set image_url = file_url(node.field_YOUR_FIELD.entity.getFileUri()) %}
  <img src="{{ image_url }}") >
  </div>

When dealing with a mobile design coming from a custom webpage that needed a lot of regions changed on it to not use the branding of the entire site, particularly, no side bars and fixed width. My mobile design was scrolling right because of extra space on the right and you could only see it on an actually mobile device. Mobile device simulators do not catch it.

If you have a scrolling issue in mobile, sometimes it is a div on the desktop page causing the issue.  Using "position: fixed", will break you Y axis scroll (Up and Down).

I had the hardest time piecing all this together.  One of the reason was because when you search for image maps, you get a bunch of maps. However after hours of searching and ChatGPTing. I finally mage this thing work. I am sure there is an easier way through some kind of coding platform but this is what I had to do.  Hope it helps someone else!

I am sure we have all ran into this, working on a view and forgetting to change the Apply to from "Apply to all views" to "Apply only to this view". Thus adding or worse, deleting fields or configurations across all view displays.

Easy solution if you use Drush. I use DDEV for my local so my command is:

ddev drush eval "\Drupal::keyValueExpirable('tempstore.shared.views')->delete('YOUR_VIEW_ID');"

This reverts the temporary changes. :)

Editors needed to tag different items to a piece of content. However because the content's header render the logo for the other tagged content, if you tagged more than two, the header would render for each tagged content.

Sooooo I thought I put a loop but because the header was based on a paragraph field, it was cooperating.

Easy solution Side by Side comparison.  (Basically, you just need to add a " .0 " to you twig field. Easy peasy!

I hade one page view in the taxonomy view that was showing the Infinite scroll "load more" text when I had the mini pager enable.

Turn out there was a block that displayed nodes with the same vocabulary that was using infinite scroll.

I changed that to a pager and the "load more" went away and my pager on the page view displayed.  

The infinite scroll block was in a completely different view too! 

Weird but I'll take it.

I don't know why this isn't any where on the web... Or at least that I could find.

I needed my block to show an image at full width if the editor selected it and another display if the editor did not select it.

For this to work you need to make sure your boolean field is set to "1/0" in two places.  The content type Fields Display section and in your view in the field.