Blogger Notable Template - Next Article and Previous Article Buttons missing - pagination

In one of the newer Google blogger templates, Notable, when you're viewing a blog post the Next Article and Previous Article buttons are not present.
This post explained how to add pagination buttons onto the blog homepage to view the next listing of articles and the previous listing of articles but didn't get into adding similar buttons on a blog post to view the next and previous article.
Example of Main Blog Page with Pagination
Example of Blog Article needing Pagination (Highlighted in Pink)
Any idea how to add this functionality? I'm just looking to add 'Previous Article' and 'Next Article' buttons to individual blog posts.
EDIT Updated images for hopefully more clarity.

I believe I've found the answer. Just needed to add
<b:if cond='data:blog.pageType == "item"'>
<b:include cond='data:newerPageUrl' name='previousPageLink'/>
<b:include cond='data:olderPageUrl' name='nextPageLink'/>
</b:if>
Within this code
<div class='post-bottom'>
<div class='post-footer'>
<!-- Footer bylines -->
<b:include name='footerBylines'/>
</div>
<b:include cond='data:view.isSingleItem and data:widget.type == "Blog"' data='{ shareButtonClass: "post-share-buttons-bottom", overridden: true }' name='maybeAddShareButtons'/>
<b:include cond='data:view.isMultipleItems or data:widget.type == "PopularPosts"' data='post' name='postJumpLink'/>
</div>
Like so
<div class='post-bottom'>
<div class='post-footer'>
<!-- Footer bylines -->
<b:include name='footerBylines'/>
</div>
<b:include cond='data:view.isSingleItem and data:widget.type == "Blog"' data='{ shareButtonClass: "post-share-buttons-bottom", overridden: true }' name='maybeAddShareButtons'/>
<b:include cond='data:view.isMultipleItems or data:widget.type == "PopularPosts"' data='post' name='postJumpLink'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include cond='data:newerPageUrl' name='previousPageLink'/>
<b:include cond='data:olderPageUrl' name='nextPageLink'/>
</b:if>
</div>

Related

hide blogger posts by label

i am new here.
i want to hide specific posts to be not showen on my homepage cux these posts related to other posts anways i tried many html codes nothing works...
below is my site's html code
`
<-- Post Content Index and Item -->
<div class='blogpost hentry'>
<b:class cond='data:view.isMultipleItems' name='index-post'/>
<b:class cond='data:view.isSingleItem' name='item-post'/>
<b:include data='post' name='post'/>
</div>
<-- Comments -->
`
i tried below code to hide some posts but it dosnt work
`<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
<b:if cond='data:label.name != "add label here"'>
<b:include data='post' name='post' />
</b:if>
</b:if>
</b:loop>
<b:else/>
<b:include data='post' name='post' />
</b:if>`
and i tried below method it works but it shows empty box between posts
`<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.labels none (l => l.name == "add label")'>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>`
i tried below code to hide some posts but it dosnt work
`<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
<b:if cond='data:label.name != "add label here"'>
<b:include data='post' name='post' />
</b:if>
</b:if>
</b:loop>
<b:else/>
<b:include data='post' name='post' />
</b:if>`
and i tried below method it works but it shows empty box between posts
`<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.labels none ( l => l.name == "Pasta" )'>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>`
simply i want to label my past as "HIDDEN" and it should not be shown on my homepage without leaving any empty space

How to hover then click a button in selenium?

I have the following portion of html code in a web page
<div class="action">
<div class="double-button">
<button class="widget-button" title="2 people liked this post">2</button>
<button class="widget-button like" title="like this post">
<svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
<use xlink:href="#far-heart"></use>
</svg>
</button>
</div>
</div>
After hovering over the first button the class name change and the code transform to
<div class="action">
<div class="double-button">
<button class="widget-button d-hover" title="2 people liked this post">2</button>
<button class="widget-button like" title="like this post">
<svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
<use xlink:href="#far-heart"></use>
</svg>
</button>
</div>
</div>
After clicking over the first button a new div appear that contains people who like the post
<div class="action">
<div class="double-button">
<button class="widget-button d-hover" title="2 people liked this post">2</button>
<button class="widget-button like" title="like this post">
<svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
<use xlink:href="#far-heart"></use>
</svg>
</button>
</div>
<div class="likes">
<a class="trigger-user" href="/USER1" name="USER1">USER1</a>
<a class="trigger-user" href="/USER2" name="USER2">USER2</a>
</div>
</div>
My objective is to select all those users using selenium and python3 so I tried the following code inspired from other stack overflow questions like link1 and link2
driver = webdriver.Chrome(executable_path='./chromedriver_83') #this works fine
driver.get("link_to_the_page") #also I get the link and all contents without problems
likes_button=driver.find_elements_by_xpath("//button[#class='widget-button']") # works fine too
print(likes_button[0].text) # This gives '2', it the right value
hover = ActionChains(driver).move_to_element(likes_button[0]) #select only the first element in the page for testing
hover.perform() # I think the hover does not work even if this is the right way
likes_button_hover=driver.find_elements_by_xpath("//button[#class='widget-button d-hover']") # now select the hovered button to be clicked, since I hovered only one button in the whole page the result shoud be one
print(len(likes_button_hover)) # this gives 0 while it should give 1
likes_button_hover[0].click() # this throw an error
I get the following error which means the button did not change the class ( the hover did not work)
raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element <button class="widget-button" title="2 people liked this post">2</button> is not clickable at point (537, 17). Other element would receive the click: <span>...</span>
(Session info: chrome=83.0.4103.116)
I tried to get into the first button in many means using for example
driver.find_elements_by_css_selector("[title*='people liked this post']")
but in vain, I think the problem occurs in the hover but I can not see why, and of course I can not get the button and click it without hovering it first.
What Am I doing wrong?
I can see two solution here.
1: As button (One you need to click to see all users) is always there but only class is changing. So you can do a direct click without hovering on it.
likes_button=driver.find_elements_by_xpath("//button[contains(#title,'people liked this post')]") # Used contains as number of people liked might change
print(likes_button[0].text) # This gives '2', it the right value
likes_button[0].click() # If not working try javaScript : driver.execute_script("arguments[0].click();", likes_button[0])
2: If you really want to click only after hovering, i guess you might need to to pause method of Actionchain class. As java script might take some time to load. In your case it is trying to find button with class widget-button d-hover immediately after hovering the mouse.
likes_button=driver.find_elements_by_xpath("//button[#class='widget-button']")
print(likes_button[0].text)
ActionChains(driver).move_to_element(likes_button[0]).pause(1).perform()
likes_button_hover=driver.find_elements_by_xpath("//button[#class='widget-button d-hover']")
print(len(likes_button_hover))
likes_button_hover[0].click()

Prestashop 1.7 attribute groups - check stock and apply css to unavailable combination

Prestashop option to hide unavailable attributes on product page doesn't work when attribute groups are used, for example color and size (for clothing shops).
I need to keep showing all possible combinations, but grey out (or strikethrough) the combinations with no stock.
Like this:
I tried several things.
In Prestashop 1.6 the following piece of code worked to apply css class (.out-of-stock-float-left) to unavailable combinations:
{elseif $group.group_type == 'radio'}
<ul id="group_{$id_attribute_group}">
{foreach from=$group.attributes key=id_attribute item=group_attribute}
{if {$group.attributes_quantity[{$id_attribute|intval}]} > 1} <!-- product in stock -->
<li class="input-container float-left">
<input class="input-radio" type="radio" data-product-attribute="{$id_attribute_group}"
name="group[{$id_attribute_group}]"
value="{$id_attribute}"{if $group_attribute.selected} checked="checked"{/if}>
<span class="radio-label">{$group_attribute.name}</span>
</li>
{else} <!-- product out of stock -->
<li class="input-container out-of-stock-float-left">
<input class="input-radio" type="radio" data-product-attribute="{$id_attribute_group}"
name="group[{$id_attribute_group}]"
value="{$id_attribute}"{if $group_attribute.selected} checked="checked"{/if}>
<span class="radio-label">{$group_attribute.name}</span>
</li>
{/if}
{/foreach}
</ul>
{/if}
When changing combinations there is an ajax request. I don't know how to grey out combinations with no stock and make them not clickable.
Thanks

change page layout dynamically in Liferay

Can anyone please tell me how to dynamically change page layout in Liferay.
Let's consider we have page with Layout 2 column(50/50) and both these columns have portlets.
If a user clicks on any of the portlets, I Would like to change the page layout to 2 column(70/30).
I have never tried it but did you try checking LayoutLocalServiceUtil.updateLayout() ?
That should help you. If you are creating a new page use LayoutLocalServiceUtil.addLayout() otherwise use updateLayout().
Get layout and then update it.
layout = LayoutLocalServiceUtil.getFriendlyURLLayout(groupId, false, friendlyURL);
Adding to-
As provided-
layoutId = LayoutLocalServiceUtil.getFriendlyURLLayout(groupId, false, friendlyURL);
pass the new page's friendlyURL,
if it is a public page then false else true for private,
and make sure that you have applied some layout to the new page(for e.g- 70/30)
Use this layoutId in -
" windowState="<%= WindowState.NORMAL.toString()%>">
provide portletId to the portletname field.
Below is a sample html portion from a layout template...
<div class="portlet-layout">
<div class="aui-w70 portlet-column portlet-column-first" id="column-2">
$processor.processColumn("column-2", "portlet-column-content portlet-column-content-first")
</div>
<div class="aui-w30 portlet-column portlet-column-last" id="column-3">
$processor.processColumn("column-3", "portlet-column-content portlet-column-content-last")
</div>
</div>
if you check it minutely, there are classes describing the width of the div, In my example aui-w70 is for width 70% and aui-w30 is for 30%. I am sure you will also get similar things in your layout too.
If you can change the class names according to your need in desired events, you are good to go...
Give it a try....

Newbie Cucumber scope question

I am trying to check for the "style='width:60%'" bit in the html below
<div class='pers-ref-rate'>
<div class='rating-type'>
Reliability
</div>
<div class='type-reliable rating'>
<div style='width:60%'></div>
</div>
</div>
I have got the line
And I should see a personal reliable rating of 60
and the following in my steps
Then /^I should see a personal (\w+) rating of (\d+)$/ do |rating_type, rating|
with_scope("div.type-#{rating_type}") do
page.should have_css('.rating', :style => "width:#{rating}")
end
end
I am getting an error
RSpec::Expectations::ExpectationNotMetError: expected #has_css?(".rating") to return true, got false
I stole the steps from another project and adapted it slightly (it was using ids not classes).
What have I done wrong?
Thanks in advance for any help.
Mark
That's looking for a
<div class="rating" style='width:60%'></div>
within the scope of
<div class='type-reliable rating'></div>
To make it work, either add the rating class to that div, or remove the css search for .rating in it.
hth

Resources