How do I use custom styling?
ethanosullivan opened this issue · comments
In Example #6, I'm having trouble understanding the instructions to use my own styling. May you give more clarification with a working example?
I want to change the image gallery layout to not show the Instagram caption in the image alt attribute.
The example 6 is about disabling default styling (CSS). What you want to do is changing the template so check example 7
I see. So I looked at Example #7, but I'm still lost on how to implement it.
<script type="text/javascript" src="jquery.instagramFeed.min.js"></script>
<script type="text/javascript">
(function($){
$(window).on('load', function(){
$.instagramFeed({
'username': 'instagram',
'callback': function(data){
$('#jsonHere').html(JSON.stringify(data, null, 2));
}
});
});
})(jQuery);
</script>From the example above, I would put the JSON structure in the #jsonHere area? May you provide a working example for me to test out?
The example 7 is about getting all the data. In the example we put that data in JSON format inside an element. Instead, you should use that data to render your feed yourself.
If this is too much you could simply use the default render and remove the alt attributes right after rendering (callback).
How would I remove or edit the alt attribute using the callback? I'd appreciate it if you can give me a working example to play around with. My JavaScript skills are limited.
Also, I don't want to have the images to go to the Instagram post when they are clicked. Instead, I would like to have them redirect to something else such as the direct image URL or a gallery pop-up (if a website has that function).
@jsanahuja - just following up on my previous message.
Try the 1.4.0 release as with the changes you might not need to remove the alt attribute content anymore. Thanks