I built up a jump pagination with a link to the last and first page in my tumblr theme with these 2 codes :
First
Last
The problem is it doesn't work with tag pages it only works in the home page so I tried to modify these codes and it worked for the last page link by changing :
Last into Last
However I didn't found the solution for the first page link can someone help me ?
My tumblr blog adress is : amadeusjacobs.com
Tumblr Theme Code Snippet
{block:Pagination}
<a id="first_page">first</a>
{block:PreviousPage}
prev
{/block:PreviousPage}
{block:JumpPagination}
{block:CurrentPage}
<span class="current_page">{PageNumber}</span>
{/block:CurrentPage}
{block:JumpPage}
<a class="jump_page" href="{URL}">{PageNumber}</a>
{/block:JumpPage}
{/block:JumpPagination}
{block:NextPage}
next
{/block:NextPage}
<a id="last_page">last</a>
<script type="text/javascript">
var f = document.getElementById("first_page"),
l = document.getElementById("last_page"),
p = window.location.pathname.replace(/\/*$/, ""),
i = p.indexOf("/page/"),
j = p.length,
u = i > 0 ? p.substr(0, i) : (i == -1 && j > 0) ? p : "/";
f.setAttribute("href", u);
u = u.length == 1 ? "" : u;
l.setAttribute("href", u + "/page/{TotalPages}");
</script>
{/block:Pagination}
Notes
This is obviously only going to work if the user has JS enabled
Works for all paginated pages
For a limited time, you can test this here
ETA
Of course, I had to play with it until I broke it. All cases should be covered, now.
Related
Apologies for another question re this, but I've tried so hard to get this working (I'm fairly new to SharePoint, don't have extensive coding knowledge, but know HTML and generally alright at trouble shooting).
We are using SharePoint online and we have SharePoint Tiles. We have recently added a few more tiles and it's obviously not wrapping these tiles, thus having to scroll right to access some.
I have found the code for wrapping the tiles here and when editing the page source, it appears to be working... until I save it. The code I put in is stripped out when I next go to the content editor.
I've read a few pages on it and have tried things such as the content editor web part, but for the life of me cannot get it to work.
If anyone would know if there's a step to step guide to ensure wrapped tiles are saved, I may be able to get it to work.
Any help is greatly appreciated.
If it changes anything, we use SharePoint online that is part of our Office 365 account.
Add the following code into script editor web part in the page.
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// Update this value to the number of links you want to show per row
var numberOfLinksPerRow = 6;
// local variables
var pre = "<tr><td><div class='ms-promlink-body' id='promlink_row_";
var post = "'></div></td></tr>";
var numberOfLinksInCurrentRow = numberOfLinksPerRow;
var currentRow = 1
// find the number of promoted links we're displaying
var numberOfPromotedLinks = $('.ms-promlink-body > .ms-tileview-tile-root').length;
// if we have more links then we want in a row, let's continue
if (numberOfPromotedLinks > numberOfLinksPerRow) {
// we don't need the header anymore, no cycling through links
$('.ms-promlink-root > .ms-promlink-header').empty();
// let's iterate through all the links after the maximum displayed link
for (i = numberOfLinksPerRow + 1; i <= numberOfPromotedLinks; i++) {
// if we're reached the maximum number of links to show per row, add a new row
// this happens the first time, with the values set initially
if (numberOfLinksInCurrentRow == numberOfLinksPerRow) {
// i just want the 2nd row to
currentRow++;
// create a new row of links
$('.ms-promlink-root > table > tbody:last').append(pre + currentRow + post);
// reset the number of links for the current row
numberOfLinksInCurrentRow = 0;
}
// move the Nth (numberOfLinksPerRow + 1) div to the current table row
$('#promlink_row_' + currentRow).append($('.ms-promlink-body > .ms-tileview-tile-root:eq(' + (numberOfLinksPerRow) + ')'));
// increment the number of links in the current row
numberOfLinksInCurrentRow++;
}
}
});
</script>
We can also use CSS style below in script editor web part in the page to achieve it.
<style>
.ms-promlink-body {
width: 960px;
}
</style>
I am scraping data from a webpage that is paginated, and once I finish scraping one page, I need to click the next button and continue scraping the next page. I then need to stop once I have scraped all of the pages and a next button no longer exists. Below contains the html around the "Next" button that I need to click.
<tr align="center">
<td colspan="8" bgcolor="#FFFFFF">
<br>
<span class="paging">
<b> -- Page 1 of 3 -- </b>
</span>
<p>
<span class="paging">
<a href="page=100155&by=state&state=AL&pagenum=2"> .
<b>Next -></b>
</a>
</span>
<span class="paging">
Last ->>
</span>
</p>
</td>
</tr>
I have tried selecting on class and on link text, and both have not worked for me in my current attempts.
2 examples of my code:
while True:
try:
link = WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.LINK_TEXT, "Next ->"))).click()
except TimeoutException:
break
while True:
try:
link = WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.CLASS_NAME, "paging"))).click()
except TimeoutException:
break
All of the solutions I have found online have not worked, and have primarily ended with the following error:
ElementClickInterceptedException: Message: element click
intercepted: Element <a href="?
page=100155&by=state&state=AL&pagenum=2">...</a> is not
clickable at point (119, 840). Other element would receive the
click: <body class="custom-background hfeed" style="position:
relative; min-height: 100%; top: 0px;">...</body>
(Session info: chrome=76.0.3809.132)
If the remainder of the error code would be helpful to review, please let me know and I will update the post with this error.
I have looked at the following resources, all to no avail:
Python Selenium clicking next button until the end
python - How to click "next" in Selenium until it's no longer available?
Python Selenium Click Next Button
Python Selenium clicking next button until the end
Selenium clicking next button programmatically until the last page
How can I make Selenium click on the "Next" button until it is no longer possible?
Could anyone provide suggestions on how I can select the "Next" button (if it exists) and go to the next page with this set of HTML? Please let me know if you need any further clarification on the request.
We can approach this problem through the solution using two major libraries - selenium and requests.
Approach - Scrape the page for page number and next page link every time
Using Selenium (If the site is Dynamic)
We can check if the page we are on is the last page or not, and if it is not the last page, we can check for the next button (assuming the website follows the same html structure for paging in all pages)
stop = False
driver.get(url)
while not stop:
paging_elements = driver.find_elements_by_class_name("paging")
page_numbers = paging_elements[0].text.strip(" -- ").split("of")
## Getting the current page number and the final page number
final = int(page_numbers[1].strip())
current = int(page_numbers[0].split("Page")[-1].strip())
if current==final:
stop=True
else:
next_page_link = paging_elements[-2].find_element_by_name("a").get_attribute('href')
driver.get(next_page_link)
time.sleep(5) # This gap can be changed as per the load time of the page
Using Requests and BS4 (If the site is static)
import requests
r = requests.get(url)
stop = False
while not stop:
soup = BeautifulSoup(r.text, 'html.parser')
paging_elements = soup.find_all('span', attrs={'class': "paging"})
page_numbers = paging_elements[0].text.strip(" -- ").split("of")
## Getting the current page number and the final page number
final = int(page_numbers[1].strip())
current = int(page_numbers[0].split("Page")[-1].strip())
if current==final:
stop=True
else:
next_page_link = paging_elements[-2].find("a").get('href')
r = request.get(next_page_link)
Alternative approaches
One method is using the URL of the website itself instead of the button-clicking process as the button click is intercepted in this case.
Most web pages have a page attribute added to their URL (visible for pages >=2). So, a paginated website might have URLs such as:
www.targetwebsite.com/category?page_num=1
www.targetwebsite.com/category?page_num=2
www.targetwebsite.com/category?page_num=3
and so on.
In such cases, one can simply iterate over the page numbers until the final page number (as originally out in the proposed answer). This approach eliminates the breakage possibility of the target website changing CSS layout/style.
Furthermore, there might be a requirement to create the next_page_link by appending the base URL as done for next_url in the other question (line 40-41):
next_url = next_link.find("a").get("href")
r = session.get("https://reverb.com/marketplace" + next_url)
I hope this helps!
It sounds like you're asking two different questions here:
How to click Next button until it no longer exists
How to click Next button with Javascript.
Here's a solution to #2 -- Javascript clicking:
public static void ExecuteJavaScriptClickButton(this IWebDriver driver, IWebElement element)
{
((IJavaScriptExecutor) driver).ExecuteScript("arguments[0].click();", element);
}
In the above code, you have to cast your WebDriver instance as IJavascriptExecutor, which allows you to run JS code through Selenium. The parameter element is the element you wish to click -- in this case, the Next button.
Based on your code sample, your Javascript click may look something like this:
var nextButton = driver.findElement(By.LINK_TEXT, "Next ->"));
driver.ExecuteJavascriptClickButton(nextButton);
Now, moving onto your other issue -- clicking until the button is no longer visible. I would implement this in a while loop that breaks whenever the Next button no longer exists. I also recommend implementing a function that can check the presence of the Next button, and ignore the ElementNotFound or NoSuchElement exception in case the button does not exist, to avoid breaking your test. Here's a sample that includes an ElementExists implementation:
public bool ElementExists(this IWebDriver driver, By by)
{
// attempt to find the element -- return true if we find it
try
{
return driver.findElements(by).Count > 0;
}
// catch exception where we did not find the element -- return false
catch (Exception e)
{
return false;
}
}
public void ClickNextUntilInvisible()
{
while (driver.ElementExists(By.LINK_TEXT, "Next ->"))
{
// find next button inside while loop so it does not go stale
var nextButton = driver.findElement(By.LINK_TEXT, "Next ->"));
// click next button using javascript
driver.ExecuteJavascriptClickButton(nextButton);
}
}
This while loop checks for the presence of the Next button with each iteration. If the button does not exist, the loop breaks. Inside the loop, we call driver.findElement with each successive click, so that we do not get a StaleElementReferenceException.
Hope this helps.
I'm using the field Frontend-Layout at my TYPO3 7.6-Backend. Because my website will have four different departments with different colours in frontend.
So I'm using:
TCEFORM {
pages {
layout {
altLabels {
0 = [ blue]
1 = [ orange ]
2 = [ green]
3 = [ yellow]
}
}
}
} ### TCEFORM
At my FLUIDTEMPLATE I'll wrap an <div>-wrapper, to set my different languages globally at my stylesheet. f.e. div.wrap.blue { background-color:blue;}
<div class="wrap
{f:if(condition:'{data.layout} == 0',then:'blue')}
{f:if(condition:'{data.layout} == 1',then:'orange')}
{f:if(condition:'{data.layout} == 2',then:'green')}
{f:if(condition:'{data.layout} == 3',then:'yellow')}">
...
This works perfect for me.
But how can I slide (or inherit) the frontend-layout-info from my parent-page to the subpages on my pagetree? I don't want to choose the frontend layout in page properties everytime, if I will add a new page into my pagetree. This must be working automatically. Is this possible? With slide?
For example
*ROOT
+ parent blue
~~ sub blue 1 /* these pages also have frontend layout 0 */
~~ sub blue 2
+ parent orange
~~ sub orange 1
+ parent green
...
+ parent yellow
...
Thebks for your opinion or tips ..
I don't think it's dead simple to set the {data.layout} layout recursively without manipulating the database. I have three 'solutions' coming to mind to solve your problem:
1) Create four Backend Layouts that you can select for your current and childpages. (Basically rinse and repeat what you have done for your first backend layout)
2) Using your layout modes you could try setting a body class using typoscript like so (i did not test this):
page.bodyTag >
page.bodyTagCObject = TEXT
page.bodyTagCObject.field = data.layout
page.bodyTagCObject.wrap = <body class="color-|">
3) Use a similar typoscript but update the value using typoscript conditions such as [pidInRootline]
page.bodyTag >
page.bodyTagCObject = TEXT
page.bodyTagCObject.wrap = <body class="blue">
[PIDinRootline = 1]
page.bodyTagCObject.wrap = <body class="orange">
[global]
[PIDinRootline = 2]
page.bodyTagCObject.wrap = <body class="green">
[global]
# and so on
I had your same problem and this typoscript worked fine for me,
the result is what you wanted to reach.
as you can see the 20.10 object is used when frontend layout is set on the page, while the 20.20 object is used when frontend layout is not set and takes it in slide mode:
page {
bodyTagCObject >
bodyTagCObject = COA
bodyTagCObject {
stdWrap.noTrimWrap = |<body |>|
20 = COA
20 {
wrap = class="|"
10 = TEXT
10 {
if.isTrue.data = page:layout
data = page:layout
noTrimWrap = |page-layout-| |
}
20 = TEXT
20 {
if.isFalse.data = page:layout
data = levelfield:-2, layout, slide
noTrimWrap = |page-layout-|
}
}
}
}
I hope I have been helpfull.
I'm having problems with TYPO3. I have been using it for quite a few years, since version 3.8 but this is my first site using version 4.5 and I am having problems with the menus and the rootline.
I believe it is related to how the rootline is created. using the code below for the breadcrumb/path type of menu only the current page is displayed. The menu only displays page X using example and code below when in page X and it should be
home > section 1 > sb a > page X
home
--- section 1
------- sub A
---------- page X
--- section 2
Also when displaying menus the ACT state isn't being properly activated. As I understand every page in the path/rootline should activate the ACT state and it is not happening with code below.
Has any thing changed in this version?
I have used both piece of codes in many sites up to now in version 4.5
codes
temp.breadcrumbs = HMENU
temp.breadcrumbs.special = rootline
#temp.breadcrumbs.includeNotInMenu = 1
#temp.breadcrumbs.special.range= -2 | -1
temp.breadcrumbs.special.range = 0
temp.breadcrumbs.1= TMENU
temp.breadcrumbs.1.noBlur = 1
temp.breadcrumbs.1.NO.allWrap= | > |*||*| |
## with and without line ... special.range ...
.....
....
temp.topmenu.1 {
wrap = <ul>|</ul>
# NO.allWrap = <li>|</li>
expAll = 1
NO.wrapItemAndSub = <li>|</li>
# Enable active state and set properties:
ACT = 1
ACT.wrapItemAndSub = <li class="current-menu-item">|</li>
}
temp.topmenu.2 = TMENU
temp.topmenu.2.noBlur = 1
temp.topmenu.2 {
wrap = <ul class="sub-menu">|</ul>
NO.linkWrap = <li>|</li>
# Enable active state and set properties:
ACT = 1
ACT.linkWrap = <li class="active">|</li>
#ACT.allWrap = <li class="selected">|</li>
#ACT.ATagBeforeWrap = 1
}
thanks
Ivan.
as cascaval wrote it's quite common to declare begin and end levels, anyway 0 value is aceptable too, as written in doc for entryLevel
Default is "0" which gives us a menu of the very first pages on the site.
Probably you put some TypoScript on the page X which has Rootlevel field checked, so it avoids traversing the tree up-side. I examined your sample code on first implementation I had available and it works as expected.
The range is supposed to be defined as [begin-level] | [end-level] so try:
temp.breadcrumbs.special.range = 0|-1
...or...
temp.breadcrumbs.special.range = 1|-1
-1 means current page.
-2 means the page one level up from the current page.
NOTE: You should probably set temp.breadcrumbs.includeNotInMenu = 1 because usually you would like to have all the pages in the breadcrumbs (as the structure that breadcrumbs represent wouldn't otherwise make sense), that is including those that you don't want to appear in other menus.
Had the same problem in Typo3 6.2.14 and finally found a solution.
After clearing "Template on Next Level" rootline worked perfectly.
Reason:
the root template was referenced in root templates "Template on Next
Level".
Solution:
edit root template
switch to tabfolder "Options"
clear field "Template on Next Level"
I have spent some time but can't figure out what's wrong. I am using CodeIgniter 2.1.0.
So basically its like this:
My pagination settings:
$config['base_url'] = base_url() . '/stores/';
$config['total_rows'] = $this->stores_model->getTotalRows();
$config['per_page'] = 20; //display 20 rows per page
$config['num_links'] = 10; //display 10 pagination links
$config['uri_segment'] = 2;
$config['full_tag_open'] = '<div id="pagination">';
$config['full_tag_close'] = '</div>';
$this->pagination->initialize($config);
I am getting data chunks like this from controller. Which is also working.
$data['stores'] = $this->stores_model->getChunks($config['per_page'], $this->uri->segment(2));
My view page have:
<?php echo $this->pagination->create_links(); ?>
Now everything is working fine. At first the 10 pagination links are shown but when I click on the link 8, 9 or 10 etc. the pagination links bloats. It shows now links 1 to 20. Why is that? It might be something very simple but can't seem to figure that out. I was expecting the pagination links kind of scroll but shows only 10 links as I have set in config.
Thanks and regards
Deepak
Now I understand
$config['num_links'] got me confused for a while.
This means the number of links to show on both sides (previous and next) of current link.
ie. (show prev 10 links from current) <----- [current page] -----> (show next 10 links from current)
setting it to 5 solved the problem. Now I have about 11 links showing in total all the time as expected.
Thanks again
Deepak