I have three like tags with different URLs (all of them working, the same site):
http://www.sawbook.pl/
http://www.sawbook.pl/like_test.html
http://www.sawbook.pl/najszczesliwszy-dzien.html
Unfortunately there is only one like button!
Are my URLs banned!?
What's wrong?
Test page: http://www.sawbook.pl/like_test.html
<dl>
<dt>http://www.sawbook.pl/</dt>
<dd>
<div class="fb-like"
data-href="http://www.sawbook.pl/"
data-layout="standard" data-action="like"
data-show-faces="true" data-share="true">
</div>
</dd>
<dt>http://www.sawbook.pl/like_test.html</dt>
<dd>
<div class="fb-like"
data-href="http://www.sawbook.pl/like_test.html"
data-layout="standard" data-action="like"
data-show-faces="true" data-share="true">
</div>
</dd>
<dt>http://www.sawbook.pl/najszczesliwszy-dzien.html</dt>
<dd>
<div class="fb-like"
data-href="http://www.sawbook.pl/najszczesliwszy-dzien.html"
data-layout="standard" data-action="like"
data-show-faces="true" data-share="true"></div>
</dd>
</dl>
I've changed the age restriction for the app that is used on the page.
Currently each of Like buttons works fine.
Thank you CBroe for your help.
I found a solution while I reported the bug, by the way, I checked the application settings.
Related
When I use an anchor tag without an href="" all is good and the button style is there, the second a add an href it completely removes the anchor tag and leave only the text inside the parent div
without href:
<div class="container">
<a class="button"> my button</a>
</div>
result in browser devtools
<div class="container">
<a class="button"> my button</a>
</div>
with href
<div class="container">
my button
</div>
result in browser
<div class="container">
my button
</div>
Looks like this could be the work of the link checker. Try adding x-cq-linkchecker="skip":
<div class="container">
<a x-cq-linkchecker="skip" href="/content/mypage.html" class="button"> my button</a>
</div>
I guess it might be also related to xssconfig
as you add 'href' attribute to div in your example
<div href="/content/mypage.html" class="container">
<a class="button"> my button</a>
</div>
In general it is not allowed, therefore AEM can remove it
/libs/cq/xssprotection/config.xml
I have an ag-grid in my html, and I want to put a button so that when I press that same ag-grid is shown but in a modal to be able to see it in more detail, but it is in the same html, and the ag-grid is exactly the same.
It can be done so that the same ag-grid is seen in the same html and controller.
Since he does not paint me anything but one.
HTML:
<div ag-grid="agGridBusqueda" class="ag-enel h113"></div>
.....
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div ag-grid="agGridBusqueda" class="ag-enel h113"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
No, it is not possible to render the same grid two times, in a modal and in a background. You would need to make a separate grid and update the values manually.
I also think this would be both terrible for the performance and the usability. The user would see grid-lines in the background when opening a modal (from the original grid) which would change as he modifies the modal-grid; I think this is disturbing. And you would have 2x the amount of rendered rows and input listeners on your screen.
I think the cleaner solution would be to just use one instance of ag-grid and (on button-click) assign class="modal-body" to it, making the container element float with an extended width and dimmed background.
I've used to create tabs with some content on it using the following code:
<div class="tabs-striped tabs-top tabs-background-positive tabs-color-light">
<div class="tabs">
<a class="tab-item active" href="#">
<i class="icon ion-home"></i>
Test
<div class="item item-avatar">
<div ng-bind="profile.img_element"></div>
<h2 ng-bind="profile.name"></h2>
<p ng-bind="profile.points"></p><p> points</p>
</div>
</a>
<a class="tab-item" href="#">
<i class="icon ion-star"></i>
Favorites
</a>
<a class="tab-item" href="#">
<i class="icon ion-gear-a"></i>
Settings
</a>
</div>
</div>
However, my problem is that the tabs doesn't switch, and on the top of that I've been unable to set the content of the tab 'Test' properly.
I did some searches, but still didn't find a solution.
I don't have enough experience with Ionic, So any help will be much appreciated.
Thank you.
href="#" should not be '#' for every tab. '#' means default root url. So when you click on every page it redirect on same page. You need to set content using 'ion-nav-view' for tab view.
Please study this CodePen for more guid
I get this error on my blog page now.
https://www.facebook.com/plugins/error/api?code=100&message=Param+show_faces+must+be+a+boolean&hash=AQCNFmFNw0GU83AX
I have no idea how to fix it. Any ideas?
I guess that this is about the Like Button/Like Box? You should specify this in your question!
If so, then you need to add the show_faces parameter/attribute as described at https://developers.facebook.com/docs/plugins/like-button/#settings
Example:
<div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="standard" data-action="like" data-show-faces="true" data-share="true"></div>
I've got the following nav on my site
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar pull-right" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="/"><span class="icon-chevron-up icon-medium"></span> Rocky Mountain Arts</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="dropdown">
Gallery <b class="caret"></b>
<ul class="dropdown-menu">
<li>For Sale</li>
<li>Sold</li>
<li>Private Collection</li>
</ul>
</li>
<li>About The Artist</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
</div>
When I view the site on my desktop, I see everything as expected, and I can navigate all of the links.
HOWEVER: When I load the site up on my iPhone, press the toggle collapse button and then expand the dropdown, I cannot click any of the sub links within the dropdown menu, rather the menu closes and either the "about" or the "contact" link activate instead.
How can I fix this?
Thanks #MiikaL for the comment. Looks like it's a bug filed over at Github that no-one is really addressing in the official source code.
https://github.com/twitter/bootstrap/issues/4550
This can be reproduced on the github components demo page
http://twitter.github.com/bootstrap/components.html#buttonDropdowns
There are people with helpful info in the tread, and the 'hack' solution seems to be
// Fixes sub-nav not working as expected on IOS
$('body').on('touchstart.dropdown', '.dropdown-menu', function (e) { e.stopPropagation(); });
This issue is finally fixed in the latest Twitter Bootstrap as of version 2.2.2:
You can read a short summary about the changelog in 2.2.2 here:
http://forwebonly.com/things-you-should-know-about-twitter-bootstrap-2-2-2/