Hide pagination?

Comments

16 comments

  • Avatar
    Thomas Morin

    Hello Katy,

    It is possible to overwrite the native code by your own CSS code but it requires knowledge in code.

    Actually, you just need to use this code in your <style> column in your template sheet:

    cards-page {
    display: none;
    }

    Kind regards.

    Thomas

    0
    Comment actions Permalink
  • Avatar
    Katy Leedy

    Thanks, Thomas. I'm using an iframe embed - how do I change that to an inline tag? I tried 

    ```

    cards-page: none;

    ```

    cards-page-display:none;

    ```

    and both resulted in losing the embed altogether.

    0
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    Hi @Katy.

    1.) There's no need to tinker the iframe. Simply copy & paste the code given by @Thomas into your <style> template (click here to learn how). Refresh your view (F5) to see the change(s).

    2.) I don't recommend using the iframe method (as discussed in detail here). 

    • For the New Google Sites, please use the default embed method via the live view or edit URL.
    • For other platforms, please use the Embed option.

    Hope this helps.


    - Randy

    0
    Comment actions Permalink
  • Avatar
    Katy Leedy

    Hi Randy,

    Thanks for your help - I thought he meant the style tag on the page. However, I've edited the style tag in my Awesome Table template with the code above and the pagination still appears. I tried using the embed option, but it overwrote other page content. I'm working on a Drupal site. 

    0
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    Hi @Katy.

    I can help you with the pagination. Please share your:

    AwesomeTable link
    Share with us your AwesomeTable & Google Sheets datasource so we can pinpoint where the problem is and provide the right solution at the soonest possible time. Detailed instructions here.

    Google Sheets datasource
    It's best to set the sharing settings to Anyone with the link. Click here to learn more.

    * You can opt to anonymize your content by using dummy data (fake, but realistic) if your Sheets contains confidential info.

     

    As for AT overwriting other content in Drupal, please revert to using iframe. Rest assured that the embed method does not overwrite content on other CMS or website builders.


    - Randy

    0
    Comment actions Permalink
  • Avatar
    Katy Leedy

    Thanks, Randy. Here is the AT link, but I'm unable to share the sheet outside my organization, so I'm not sure it will work.

    Here is the style section of my template: 

    \\\

    #dashboard {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    }
    .cards-page {
    none;
    }
    .card-link{
    display: inline-block;
    width: 100%;
    text-decoration: none;
    color: #000;
    }
    .card-link>img{
    float: left;
    padding-right: 7px
    }
    .title{
    font-weight: bold;
    }
    .description{
    color:grey;
    }

    \\\

    I wrote display:none under cards-page, but it changed itself to none.

    0
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    Hi @Katy.

    It's best to set the sharing settings to Anyone with the link. Click here to learn more.

     

    0
    Comment actions Permalink
  • Avatar
    Katy Leedy

    My organization doesn't allow sharing externally, so I pasted the code above. Is that enough?

    0
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    Thanks for the update, Katy.

    The view in question might be using legacy CSS selectors (that's probably why the solution shared by @Thomas didn't work). I need to see it personally to provide the solution. 

    Please read our article on Do I need to share my Google Sheets datasource and Awesome Table view to the Support team? to learn more.

    As a workaround, you can opt to create a simple replica using a handful of dummy data. This way, I will see the same view containing the pagination selector.

    - Randy

    0
    Comment actions Permalink
  • Avatar
    Joseph Vaughan

    @Randy could you say more about what you mean by legacy CSS selectors?   And how can one change that in a view?

      I am having the same problem as Katy.   Even when there is nothing else in my <style> column in the Template sheet, it has no effect on the view. 

    I still see 1-12/12 at the top of the cards view

    I have tried both of these:

    .cards-page {
    display:none;
    }

    //Thomas's original suggestion
    cards-page {
    display:none;
    }

    1
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    Hi @Joseph.

    The legacy CSS selector (naming convention used in the previous versions) is just my hunch since the code wasn't working for @Katy (I couldn't confirm the root cause because there wasn't any follow up from her). Please grant me access to your view by sharing your:

    AwesomeTable link
    Share with us your AwesomeTable & Google Sheets datasource so we can pinpoint where the problem is and provide the right solution at the soonest possible time. Detailed instructions here.

    Google Sheets datasource
    It's best to set the sharing settings to Anyone with the link. Click here to learn more.

    You can opt to anonymize your content by using dummy data (fake, but realistic) if your Sheets contains confidential info.

    ** Otherwise, please add me as a GSheets collaborator with view-only access.


    - Randy

     

    P.S.

    Good catch on the missing period for the .class selector.

    0
    Comment actions Permalink
  • Avatar
    Joseph Vaughan

    Thank you for the fast response, Randy.  I have shared comment access to the datasource to your gmail address, and I have shared the edit link to the view, also to your email address.

    side comment: Does the configuration of the edit link mean that anyone who guesses the URL can edit a view?

    Best,

    Joseph

    0
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    @Joseph's Issue resolved via email.

    Solution: Adding the !important suffix to the property.

    .cards-page {
        display:none!important;
    }
    0
    Comment actions Permalink
  • Avatar
    Randolph Abelardo

    It was a pleasure helping you, @Joseph :) 

    Editing a view can only be done by:

    • the view-owner, and
    • anyone (but only if you grant them editor-access to your view). More about it here.

    You can also set the Google Sheets restrictions depending on your needs. Click here to learn how.

    - Randy

    0
    Comment actions Permalink
  • Avatar
    Joseph Vaughan

    Awesome support! Thanks

    0
    Comment actions Permalink
  • Avatar
    陳威廷

    Hi @Randolph

    While using "Table" as Visualization type, how may I turn off my pagination part with css codes?

    I found ".cards-page" only works in Card View...

    - Trifox Chen

    0
    Comment actions Permalink

Please sign in to leave a comment.