I use a piwik installation on /site.xy/piwik to track 2 sites (site.xy and othersite.xy)
Is it possible to have different independet opt-out iframes for each domain? Currently it seems, when I opt-out on the first site, the setting is changed on the other, too.
<iframe style="border: 0; height: 200px; width: 600px;" src="https://site.xy/piwik/index.php?module=CoreAdminHome&action=optOut&language=de"></iframe>
No, it's not possible currently. Please see https://github.com/piwik/piwik/issues/6505
Related
I have a Site that have(/will have) all my things on internet.
I'm doing the Works page that will contain all my projects (they already are on the site but not yet indexed, such as Aquarium)
My questions is:
Anyway to make a page preview for my Projects without having to take screenshot of the every page? (I already look into google and found nothing)
What i want to do is like this(done in figma):
(https://i.stack.imgur.com/B4ijk.png)
*edit 1: iframe is to hard to control, i wanna to transform this in a link and iframe simple dont work with it
Works fine for me
iframe {
display: block;
pointer-events: none;
}
<a href="https://example.com/">
<iframe src="https://example.com/"></iframe>
</a>
I'm playing a video in ReactPlayer that generates an HTML5 video in a <video> tag. It's not working on mobile (tested on Safari, Chrome, and Firefox on iPhone 8 iOS 13.5.1)
I saw this question which let me know to disable autoplay and add playsinline for mobile, but it's still not working for me. The file I'm pulling, if it's relevant, is hosted on Google Cloud Storage
<div id="ReactPlayer" style="margin: auto; border-radius: 10px; min-height: 360px; min-width: 640px; display: block; width: 80%; height: 80%;">
<video src="link_to_my_video" preload="auto" controls="" playsinline="" webkit-playsinline="" x5-playsinline="" style="width: 100%; height: 100%;">
</video>
</div>
Does anyone know how to make it play on mobile? Thanks
EDIT
If helpful my links look like
"https://firebasestorage.googleapis.com/v0/b/my-mvp.appspot.com/o/videos%sub-folder?alt=media&token=my_token"
and the video it's pulling in is a .webm file
For me, what worked was recording the video using mp4 instead of webm. This opens the issue of Chrome only being able to record using the webm MIME type, so you're essentially choosing between recording on Chrome, and Viewing on mobile devices. I don't have a clear answer on making video universal across all browsers
I will leave this question open in the hopes that someone can come up with a better solution
Responsive adsense ads are working fine on my responsive website but I would also like to add horizontal "ad links" to the website (to be shown only on desktop due to higher width).
So, what I want to do is place 728x15 ad link unit in the responsive site and make them visible only for large screens (read desktop). However, as per adsense policy, changing ads through media queries is allowed only in responsive ad units (through display: none) but there are no responsive ad for "ad links".
Any ideas how can I implement adsense "ad links" in a responsive website so these link ads are shown only on larger screens (say for min-width:800) without violating adsense policies.
Thanks.
As far I can see display:none method for not showing AdSense ad, does work with (asynchronous) link units and I think it does work for all asynchronous AdSense units. (For every AdSense snippet with adsbygoogle.js in script src.)
But, you are right: AdSense Help Center is not mentioning "asynchronous" and it explicitly says "Hiding ad units at anytime (e.g., display:none), unless you're implementing a responsive ad unit".
My wild guess is that might be because there are already #media queries in original responsive code (code you get from the AdSense dashboard), and the risk of error and the number of modifications are minimal:
removing inline style attribute from ins tag
updating "default" class declaration block in style tag ("first line")
applying display:none on ins tag via custom class (.adlinkunit1 in example below)
So this should work for you ("link ads are shown only on larger screens (say for min-width:800)":
<style type="text/css">
.adlinkunit1 { display:inline-block;width:728px;height:15px }
#media ( max-width: 800px) { .adlinkunit1 { display: none; } }
</style>
<ins class="adsbygoogle adlinkunit1"
data-ad-client="ca-pub-..."
data-ad-slot="..."></ins>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
(Please note max-width is used for display:none.)
Personally I think above example is not a violation of the AdSense policies, but also I'm not sure why Help Center says "responsive" and of course - what will happen if Google would ever decide (for some reason) to remove (undocumented) display:none support from non-responsive asynchronous units.
You could also try a "device detection" solution like WURFL cloud, which at the time of writing this costs $40p.m.
With that solution, you can get things like "IS_DESKTOP" and "IS_MOBILE" and "IS_TABLET".
From there you can really customise your ads to your different devices. For example, on the desktop you can display the 728x15 block, and on mobiles you can display something smaller like 200x90, meaning you're not missing out on possible mobile based revenue.
It also allows you to test different ad blocks on different devices really well... what works best on tablets? Is it 728x15 or 468x15. Or what about normal ad blocks (not ad links) on mobile devices, is it text only, or image, or both? Does an ads perform better in different positions on different devices?
You can get really granular with this approach in an easily maintainable way. If you have a decent amount of traffic to your website you shouldn't have a problem making more than an extra $40p.m in adsense revenue, mitigating the cost of using a service like WURFL cloud (and no, I am in no way affiliated with then, it's just a solution I use, partially based upon my desire to have an easily maintainable way to get really granular with my adsense on different devices).
Good luck.
A solution called WURFL.js allows you to leverage WURFL at no cost (community edition)
http://wurfl.io
The same framework with more WURFL properties and more features is available though the Business Edition of the same tool. To avoid doubt, I am affiliated with ScientiaMobile, the company that offers these tools.
I am trying to debug my AngularJS app where display:none is injected in tag as shown below:
This is how the img tag should be displayed:
<img ng-src="{{clientImage}}" style="margin: 0 0 0 5px;" />
This is what I get:
<img ng-src="{{clientImage}}" style="margin: 0 0 0 5px; display: none !important;" />
Can someone please help me by suggesting how I can trace how the (display: none !important;) is injected? Also any thoughts on what could possibly be injecting this in my img tag?
Notes:
- This problem happens only on some browsers but not all browsers, actually I've tried reproducing the bug on same browser version but on two different machines but failed.
- I am using Chrome latest version for testing
Turn off ad block.
I had an image named 'Advert.png', spent too much time to realize ad block was blocking it ¬¬.
This issue comes when adblocker extension is used in browsers when you'll pause you'll be able to see the images and this inline CSS will not be shown.
I had a similar situation. it was because of the ad blocker I had installed on Chrome. My application worked fine on Firefox which didn't have an ad blocker installed. But chrome didn't show an element.
After few hours of Googling I figured out that the id of the element which was not shown by chrome was the issue. The Id I had for the particular element was "post-ad". I changed it to "make-new".
That's it. It started working :)
I think Ad blockers find certain ID s and names of the html pages to decide whether to show it or not.
Hope this helps somebody
I had this happened to me when loading images from src attrib,
the inline style "style="display: none !important;" was added for some images.
Try disabling the angular inspector plugins in Chrome.
It happened to me in normal mode, but in incognito mode,firefox,opera,mobile everything was ok.
First of all, check in DevTools if it's showing which CSS rule hides that.
It should give you file and line. If it's not, try disabling Javascript to see if that helps. Or scan manually the files and look for .hide(), .toggle(), etc. (if jQuery is used).
To debug further, you can try to set the breakpoint on subtree & attributes modifications by selecting the element and in context menu select 'Break on...' (as shown below).
You may also try Visual Event. See also: How to find event listeners on a DOM node?
Is there any specific html tag or meta tag that tells a web page is designed for mobile devices? I have created a mobile sitemap linking the mobile web pages, but I am afraid of search engines don't identify these webpages as mobile versions.
I Recommend using Media Queries in your CSS and focusing on developing your mobile website first if you're going to use this technique.
Basic Example
#media only screen and (min-width: 480px){
//insert styles SPEFIC to resolutions greater than 480px wide
}
Regarding the comment:
//default CSS
.hidden-for-mobile{ display: none;}
//overrides the hidden style, and displays your element in larger resolution browsers.
#media only screen and (min-width: 480px){
display: inline; //or block or whatever you want
}
there may very well be a different or better way to implement this, but the point is...
If you are trying to control the look/feel of your website, do your best to keep it in the stylesheets
pro tip: You will want to use em / % based widths to ensure your site responds to your users browsers properly
Check out a working example with HTML5 Boiler plate here.
And Media query browser support list here
Additionally, if you are concerned about tracking your user base, Google Analytics can do that for you. You can break down your traffic however you'd like.
No, there is not. You can use JavaScript to detect mobile browsers, and direct users to special mobile versions of your webpages, but there is nothing that says for a specific page this is for a mobile browser.
If you are concerned that you will be presenting duplicate content to Google, block the spidering of your mobile site via a robots.txt file, then ensure that mobile users are always redirected to the correct mobile site.
If you're concerned about styles and things then see How to setup HTML for mobile Devices with an header-image, that takes whole width of browser?
Else, if you don't want search engines linking to m.domain.com instead of domain.com (or whatever) then I'd think about doing some PHP header detection to redirect to the main site.
To ensure they're not crawled at all so will never show in search results, add
<meta name="robots" content="noindex" />