I am using the code generator for the Pin It widget here: http://business.pinterest.com/widget-builder/#
and have selected the "Add any image on page" option. However the widget shows me a blank rectangle when I try to use the button to pin. There are 6+ images on the page, all with a direct URL (including http://). When I read through the documentation here, it says an image must be selected for it to work, but when you select the "add any image on page" option it doesn't ask you to specify an image.
How can I make this work so users can pin any image on the page? Anyone else have this problem? I would expect this option to function similarly to the Pin It Bookmarklet.
Make sure the script tag is located right before the closing body tag, if you include the script in the head tag, you won't get the list of images.
This is noted on the page where you generate the code (http://business.pinterest.com/widget-builder/#do_pin_it_button) but it is easy to miss!
Related
I am using Google Analytics on a Sharepoint site. On the main page, we have an image in an image carousel that once clicked will bring you to a different page on the site. I have tried everything to track clicks on this image in GTM - click url, click ID, css selector, etc. I can not figure out why my trigger never fires. I have attached the
image, what pops up when I click inspect, and variables that show up with the click in GTM preview... (This is the second half of the variables in preview).Three images total.
Good job on including all the relevant debugging info.
Judging from your inspect, you're looking at the image.
However, judging from your click event inspection, the click lands on an a.
I don't see the a in your DOM on the screenshot, but it may be either dynamically added, or just outside of the screenshot.
No matter. Let's start to carefully debug it. Make a trigger that would be triggered on anything that matches a. That's just a debugging trigger. Make sure it triggers on your image clicks.
Now, let's just make a simple CJS variable that would console.log({{Click Element}}). No need to use it anywhere, just make it. Go to the debug view again, try clicking the banner again and look in the console for something that would look like this:
See that pretty element? Now the wonderful dev console allows you to copy JS path to this element and do whatever you want with it. Mainly, comfortably and quickly test CSS selectors against this element. I suggest changing the selector JS console generated. It should work (unless the page is too dynamic), but it would be fragile. Having the element, however, you'll be able to make your own selectors.
I created a Page using Microsoft 365 admin credentials . Page contains staff directory details .
I wanted to publish this page on another page as a web part .
So I clicked on + symbol and gave embedded page option and added the link of the page ,I created as a web part .
But when it appears on the published page it’s having a header content share point and also has the user who has logged in .
On clicking the share point header it navigates to my home page where in , I cannot come back to this page again unless I give back button .
Can anyone say ways to remove the share point header from the web part .
i managed to remove the header sharepoint which appears in blue colour as it appears at the top.
Below is the orange color search icon which i wanted to hide as well. On hiding that from iframe, right side there appears a serach box it disappears.
Do we have any ways to hide the orange colour search icon or any ways to make it dummy?
Step 1: Inspect the page and search for the css element. Get it's id/class
Step 2: With javascript prevent it from loading in the iframe.
As for the going back thing, you can style your iframe such that it appears over the button.
Does anyone know if there is a way to use the "scroll to text fragment" feature in a link (e.g. "http://url.com/page/#:~:text=highlight%20this") in addition to another hash action in the same link?
I have a page with tabs (its a divi tabs module in wordpress) and when clicking link on another page coming to this page I would like to open a tab (can be done with "http://url.com/page/#tab|2") and also highlight text within that tab.
Does anyone know how to do this?
If I first go to "http://url.com/page/#tab|2" (opens the tab) then append "#:~:text=highlight%20this" or "&:~:text=highlight%20this" to the end of the url, it achieves the desired affect. But it does not when going directly to "http://url.com/page/#tab|2#:~:text=highlight%20this" (it just redirects back to "http://url.com/page/#tab|2")
Any ideas would be appreciated.
I am cloning https://www.sovereignselfdefense.com per request from the owner. To create a Wordpress site. The site that is currently up is a Kajabi site. I have downloaded all images from the Kajabi site by simply right clicking the site and clicking download. I made the Wordpress theme and the images that did not download (shown with arrows) display fine in the custom wordpress theme.
All images, except these images in the CTA (for example, the gentleman with his arms out) are downloaded.
The client is transferring from Kajabi to Wordpress. I am afraid that the cloned wordpress theme is getting these images from the Kajabi site and, when said site is taken down, that I wouldn't be able to get these images. The Wordpress theme works, and displays these images for now.
I used Google Chrome Inspect Elements to try to find what this image is, and how this image is displaying. I am confused.
I'm requesting some tips on how to identify how the site loads these images in the CTA, so I can download them and link the wordpress theme's html accordingly. If someone could teach me how to identify one image, I believe I will be able to identify the rest of the images. Thank you for helping out.
In the inspect you can see the html code there is style expand it and you can access the background image's URL.I have just highlighted in the images.
They have attached a style block before the parent div of any container which has a background image just expand that style tag and get the image.
Image-1:
Image-2:
Image-3:
Image-1: https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/themes/2031124/settings_images/tzJ4ad46RcSJinm7qbnO_Edited-image.png
Image-2: https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/themes/2031124/settings_images/qqHvByszR1iu2rvfEQwg_defending2.jpg
Image-3: https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/themes/2031124/settings_images/AWzmDDsWTlKOdoWPatUA_SovereignSelfDefenseBrandingPhotography-59.jpg
By clicking the image if you can drag it directly to your desktop that means that image is used by
<img src="">
tag in the code. Either it's used through css.
For your code please check the css file and you will get the image use as "background-image:url()" or you can check through inspect element section by section.
If you are using Google chrome then you can download and install this cool extension.
I'm a Gentleman
Here is the description from that link.
Easily save images with a click, gestures or the extension button.
Save images with one click by using the alt + click hotkey (holding the alt key and clicking the image).
Or save images by dragging them (drag the image slightly on any direction).
Download every image on the page by using the extension button (green button on the top right).
Note: The images are downloaded in the default directory for downloads of Chrome.
Installation Note: After installing, Chrome doesn't add any extensions to the currently opened tabs (so, you have to reload the tabs that were opened before the extension was installed to work it to work on them).
Also, you can inspect the page. below is the step on how to access inspect Element.
Right-click anywhere on the webpage, and at the very bottom of the menu that pops up, you will see "Inspect." Click that.
Click the hamburger menu (the icon with 3 stacked dots) on the far
right of your Google Chrome toolbar, click More Tools, then select
Developer Tools.
Now if you want to find out the image you can simply find it by clicking CTRL+F and type like .png or .jpg any other extension that you want to find.
Here is the example.
You can click right click then click save image as and when you are saving it.under the name you will find the type.
Some websites make it almost impossible to get the image. I remember trying to save a background theme image from the old gmail.
If you find yourself in that situation, open the Developer Tools, go to Network, filter by Images then sort by Size descending, so you get the biggest image to be the first one, then hover over each file to find your image.
You want to sort by the file size, because most of the times, the big background images are the largest in size.
Just checked out your website out..
Image 1
You can find this right below the line where the section id is 1574286919067
Image 2
Similar to the first image, this is under the section 1589827030126
Image 3
Once again, under section 1589828889742
Hopes this helps you out.. Let me know if you want to have anymore queries about the same.
The images itself:
-> Image 1: https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/themes/2031124/settings_images/tzJ4ad46RcSJinm7qbnO_Edited-image.png
-> Image 2: https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/themes/2031124/settings_images/qqHvByszR1iu2rvfEQwg_defending2.jpg
-> Image 3: https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/themes/2031124/settings_images/AWzmDDsWTlKOdoWPatUA_SovereignSelfDefenseBrandingPhotography-59.jpg
I have an iframe which simply displays a slideshow of our different products. It's hosted on the same server, it was just easier to use an iFrame.
Each slide contains a link to the current product on the slide, i couldn't use an href on the anchors, so instead i used " onclick='window.top.location.href =...' ". (This also prevents right clicks for the links.)
So my question is can i enable middle mouse clicks (and right clicks) for the links so that we can open them in a new tab, or would i have to go back to using an href.
Note - The reason i used onclick instead of href, was because with href the link would open inside the iframe instead of changing the top page. Is there another way to circumvent this and still keep normal clickability? Thanks in advance guys :)
Why you are not using a tag with target attribute?it will open link in new window.
add target="_blank"