Portfolio header image - custom HTML to add

chillwiddastill

Hi Air,

In the single works page, I have the feature image for that work piece as a full width image across the top and the title of which sits on top of that.

I have a bit of custom HTML I would like to add so it shows a scroll button to force people to scroll when on a mobile, as the image takes up the full screen.

The HTML and CSS is already set and I am using this on the homepage currently with no issues, however this is set as custom html within the containing div for the image on the homepage that I added into the Visual Composer, so it was pretty straight forward to do.

As the single work template uses the feature image function over something within a Visual Composer element, can you please tell me where I can find this function in the php file to add my custom HTML? That way whenever I add new work projects, it would dynamically pull in the code to load the scroller thingy.

Here is the code I have for adding so it creates the button to scroll:

<div class="swipe-down-mob"><a href="#scroll"> <div class="finger-mob"> <div class="scroll-mob"></div> </div> </a></div>

And essentially it looks like this:

https://cl.ly/3R371r422U29/Screen Recording 2017-03-16 at 11.38 am.gif

Therefore I just need to know where and in which template I add this to load this scroller. Its set with Media queries so will only load on a mobile etc.

Thanks!

Air

Hi there:-)

Try in fatmoon\advance\utilities\layout_parts.php line ~702 before
$html .='</div></div></header>'; add this

		if($page_type['work']){
			$html .= '
<div class="swipe-down-mob"><a href="#scroll">
  <div class="finger-mob">
    <div class="scroll-mob"></div>
  </div>
</a></div>
			';
		}

Hope this will do the trick.

With kind regards.

chillwiddastill

You sir, are a legend!! Works a treat, thanks! Now to get onto some MORE custom CSS for it! DOH