• Resolved catwhite216

    (@catwhite216)


    Hi David,

    I have been trying to create basic PDF lists for minutes and other reports ala @cuckoofairweb Parish Council pages. I was finally able to get 2 file names to appear.

    I cannot locate my mla_styles template to customize the css. Can you please point me in the right direction? I have tried adding code to the actual page. Do I need a child theme or need to work with FTP files?

    I am using the UUA theme that has not been significantly updated since 2017.

    Many thanks,
    Cat

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter catwhite216

    (@catwhite216)

    Thanks, Paul & David,

    I started a fresh topic this morning because I’m not sure where to place the CSS. I’ve done several searches in the Forums and can’t find that listed. I work during the day so I did not respond earlier.

    Thanks in advance.
    Cat

    @godshillpcweb

    Plugin Author David Lingren

    (@dglingren)

    Thanks for starting this new topic. You wrote “I cannot locate my mla_styles template to customize the css.

    You can apply any CSS styles you like to your gallery by creating a custom style template. You can also change the HTML content with a custom markup template. You can find more information about both in the “Style and Markup Templates” section of the Settings/Media Library Assistant Documentation tab. To create the Style Template:

    1. Navigate to the Settings/Media Library Assistant Shortcodes tab.
    2. Click on the “Style” view just above the templates table.
    3. Hover over the “default (default)” Style entry (for the Gallery shortcode) and click the “Copy” action link.
    4. When the page refreshes, the “Edit Template” screen will appear.
    5. Change the template Name to (for example) “cat-styles”.
    6. Make the changes you need to apply the styles you’d like.
    7. Scroll to the bottom and click “Update” to save your template.

    Once that’s done you can add the template to your shortcode with the mla_style=cat-styles parameter. Creating a custom markup template is very similar. With custom style and markup templates you do not need to use a child theme or make any changes to your site’s files.

    I am leaving this topic unresolved for now in case Paul adds more information about the solution he developed.

    Thread Starter catwhite216

    (@catwhite216)

    Hi David,

    Thank you so much for the excellent and succinct instructions. I am now testing various options. I work incrementally to make sure I can back out of trials.

    I seem to be having difficulties with categories and other shortcode components. I have managed to get ALL PDFs to appear on the page. I’m afraid it will tak an embarrassingly long time to work through all the options.

    The examples I see from people are exactly what I’m hoping for to manage things more efficiently. Many thanks for the great help and plug-in.

    Paul, I may need some formatting code help once I get the basics worked out.

    Gratefully,
    Cat

    cuckoofairweb

    (@cuckoofairweb)

    Hi Cat.

    I too did stuff incrementally asking help David from time to time.

    To give you an insight here’s the full details for this web page: agendas list Ignore the stuff at the top – the MLA section starts with ‘Archive’.

    This is the shortcode on the page:
    [mla_gallery mla_markup=basic-2-column mla_style=basic-2-column my_gallery_title=”2022 Documents” category_name=pub-doc tag=”main+2022″]
    It tells the excellent mla plug-in which markup and style to use, what title to display, and finally to only display published-documents for the main committee and for the year 2022. This basic format then repeats for different years.

    The markup looks like:
    ARGUMENT

    post_parent=all
    post_mime_type=application/pdf 
    size=icon_only 
    columns=1
    mla_image_attributes='width="16" height="16" ' 
    link=none
    orderby="name DESC"

    OPEN

    <h3>[+template:([+query:my_gallery_title+])+]</h3>
    <table id="[+selector+]" class="gallery galleryid-[+id+] gallery-size-[+size_class+] ">
    <tr class="header-row">
    <th class="gallery-title">Document Title - click to view</th><th class="gallery-icon">Icon shows</br> File type</th>
    </tr>

    this is more complicated than yours may need to be as I have several MLA tables on the same page so I use [+selector+] to give them unique ids.
    ROW OPEN
    <tr class=”gallery-row”>
    ITEM

    <td class="gallery-title">
    <a href="[+filelink_url+]" target="_blank">[+title+]</a> 
    </td>
    <td class="gallery-icon">
    <a href="[+filelink_url+]" target="_blank">[+link+]
    </td>

    ROW CLOSE
    </tr>
    TABLE CLOSE
    </table>

    and the associated style is:

    <style type='text/css'>
    #[+selector+] {
    margin: 0;
    width: 100%;
    border: 0px solid #ff0000;
    }
    #[+selector+] table {
    border: 0px dashed #00ff00;
    border-collapse: separate;
    padding-top: 1px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    }
    
    #[+selector+] tbody {
    border: 1px solid #AD855C;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    width: 100%;
    }
    #[+selector+] th.gallery-title {
    width: 88%;
    height: 16;
    vertical-align: top;
    border: 1px solid #AD855C;
    }
    #[+selector+] th.gallery-icon  {
    width: 12%;
    height: 16;
    vertical-align: top;
    border: 1px solid #AD855C;
    }
    #[+selector+] td.gallery-icon img {
    border: 0px solid #ff00ff;
    }
    #[+selector+] .gallery-row {
    float: none;
    text-align: left;
    width: auto;
    padding: 0;
    }
    #[+selector+] td {
        padding: 0.2em;
        border: 1px solid #AD855C;
    }
    #[+selector+] .header-row {
    float: none;
    text-align: left;
    font-weight: bold;
    }
    #[+selector+] .gallery-caption {
    margin-left: 0;
    vertical-align: top;
    }
    </style>

    I must admit that my CSS skills are poor. I usually end up INSPECT ing the web page in chrome to see what CSS element needs changing!

    As a result I don’t use a Child-theme but instead have found that in WordPress under appearance theme there’s an Additional CSS section where I can put any CSS I want for the entire site.

    cuckoofairweb

    (@cuckoofairweb)

    Hi in terms of selecting subsets of files. I found that categories work best if you’re making a single selection whereas tags can take multiple selections. Also, you have to use the slugs. So although the category is called published documents the short code uses the slug pub-doc.

    I also developed https://godshillparishcouncil.gov.uk/mla-pdf-debug which displays the meta-data I’m interested in. Long story but the web site was setup to make it easier to update as some of the info is taken from properties in the pdf files. These can set in the source package eg WORD and flow all the way through to the website.

    cuckoofairweb

    (@cuckoofairweb)

    and finally this website https://downtonparishcouncil.gov.uk/ goes to town as it has many committees, governance documents, finance documents etc that all get selected and displayed using MLA. There’s two layouts – one for agendas and minutes and one for policies.

    Plugin Author David Lingren

    (@dglingren)

    Wow! Thanks, @cuckoofairweb, for all of your hard work and generous contributions to this topic. The style and markup templates are a great resource and I enjoyed having a look at your “DEBUG Details of all PDF Files on Web Site” page.

    Recent MLA versions have added an “Attachment File Metadata” box to the Media/Edit Media screen which give you an easy way to inspect the metadata for a single file but having all the documents on pne page with better formatting is very useful.

    Plugin Author David Lingren

    (@dglingren)

    @catwhite216, @cuckoofairweb

    It has been a month since the last post in this topic. I am marking the topic resolved, but please feel free to update it if you have other information to share. Thanks!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘mla_styles template Location?’ is closed to new replies.