GlennimusPrime Posted May 14, 2020 Share Posted May 14, 2020 Site URL: https://gdvfx.net/ Hello, I've found som instructions on embedding gfycat videos or gifs to my site, but haven't been able to get it working. I am a coding novice, so I'm likely doing something wrong. The instructions found here: https://github.com/gfycat/gfycat.js state to enter this code right after the opening <body> tag: <script> (function(d, s, id){ var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "https://assets.gfycat.com/gfycat.js"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'gfycat-js')); </script> Then to include an embed tag: <div class="gfyitem" data-title=true data-autoplay=false data-controls=true data-id="BestYellowishElephantseal"></div> So what I've tried is selecting the settings gear on the page I'd like to add the embed to, go to advanced and entered the code into the 'Page header code injection' Then I tried to add both a code block and an embed block with the above example embed tag with no luck. What am I doing wrong? Any help woudl be greatly appreciated! - Glenn Link to comment
tuanphan Posted May 20, 2020 Share Posted May 20, 2020 For future members. Add to Code Block <img id="block-ShoddyCoarseBluewhale" data-id="ShoddyCoarseBluewhale" class="gfyitem" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> /*var client = { client_id: '2_nAwMgY', client_secret: 'SECRET_KEY' // GET client_secret here https://developers.gfycat.com/api/ }*/ /*$.ajaxSetup({ beforeSend: function(xhr) { xhr.setRequestHeader('Authorization', 'Bearer ' + client.client_secret); } });*/ $( document ).ready(function() { var url = 'https://api.gfycat.com/v1/gfycats/' $('.gfyitem').each(function(index) { var gifID = $(this).data('id') var blockID = $(this).attr('id') var itemImg = $(this) $.get( url+gifID, function( data ) { var videoString = '<div id="'+blockID+'"><video loop="true" autoplay="true" muted><source src="'+data.gfyItem.mp4Url+'" type="video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\""><source src="'+data.gfyItem.webmUrl+'" type="video/webm; codecs=\"vp8, vorbis\""></video></div>' itemImg.replaceWith( videoString ) }); }) }) </script> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment