Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

E

ErEs

@ErEs
About
Posts
21
Topics
11
Shares
0
Groups
0
Followers
0
Following
0

Posts

Recent Best Controversial

  • custom post types in laytheme
    E ErEs
    Jun 22, 2023, 10:32 AM

    i would like to use custom post types in laytheme. developing child themes and taking advantage of custom code, this in my eyes would be the last missing step to make laytheme even more powerful and build custom, personalized themes :)

    Feedback

  • Thumbnail Grid Layout change
    E ErEs
    Apr 12, 2023, 10:52 AM

    @XLD hey, great idea. all the information for the thumbnail grid is stored in the data-config attribute. changig its values leads to a different appearance on your website.

    in this example i changed the desktop columns to be 8 and then attach this value back into the data-config attribute. in your case this would be 4 columns for layout two.

     // Get the thumbnail grid
      const thumbnail = document.querySelector('.thumbs-collection-region');
    
      // Get the current value of the data-config attribute
      const dataConfig = JSON.parse(thumbnail.getAttribute('data-config'));
    
      // Update the colCount property of the desktop object
      dataConfig.desktop.colCount = 8;
    
      // Convert the updated object back to a JSON string
      const newDataConfig = JSON.stringify(dataConfig);
    
      // Set the updated value of the data-config attribute
      thumbnail.setAttribute('data-config', newDataConfig);
    

    there is one thing however, i could not figure out either. if i wrap this code in a click event ( e. g. if i click on a button ), the code gets updated correctly but on the page itself nothing changes. i guess i am missing something here for updating the css?

    maybe someone will read this old post and come up with an idea.

    General Discussion

  • child theme
    E ErEs
    Apr 8, 2023, 12:02 PM

    hello

    i am currently working on a child theme for lay theme.
    when i upload my child theme in wordpress > themes > upload.
    everything works fine and all custom styles are applied.

    except that all settings from the customizer seem to be overwritten. i guess my child theme is somehow overwriting the parents theme settings for customizer.

    however in my code i am not overwriting the customizer at any time.
    in my child theme there is only the bare essentials: style.css and function.php, which enqueues the style.

    i already took a look here: http://laythemeforum.com:4567/topic/441/main-menu-dropdown/4
    and i used the lay-child.zip file you provided.

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • Centre height aligned Carousel
    E ErEs
    Jan 3, 2023, 5:15 PM

    @arminunruh is there any chance this will be implemented in the future? personally i think it would be really useful in many cases :)

    Addons

  • Custom Arrow Cursors with Mixblend-Mode
    E ErEs
    Nov 26, 2022, 7:21 PM

    hi
    i want to ad mix-blend-mode: difference to the custom arrow cursors (svg) for laytheme carousel and fullscreen slider. how can i do this?

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • Change appearance of categories in URL
    E ErEs
    Nov 26, 2022, 4:06 PM

    hello

    is there any way to change or get rid of the default behavior of categories in url?
    by default categories are being displayed with a "#" at the beginning:
    ... /home/#category-foto

    this however prevents doing simple changes to specific category site with just css using .slug .

    maybe there is a workaround?

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • multiple modals with project-specific texts
    E ErEs
    Oct 4, 2022, 9:20 PM

    @arminunruh

    thank you for your quick response! these are all great tips which i have not thought about yet. i will go for the "get by id" function.

    great support as always.

    merci :)

    General Discussion

  • multiple modals with project-specific texts
    E ErEs
    Oct 2, 2022, 11:51 AM

    hello,

    i have question on how to solve a specific problem with code.

    i custom coded a modal for my project-pages using custom html, some javascript and custom css (see code below).

    on my website i have a button called information. clicking on it activates a modal showing some text (project description). i used custom html, instead of pasting my button in the gridder for every single page so it will be displayed on top of my fixed menu bar(!).

    Because i used html at top, it will by default be displayed on every page.
    This also means my modal text (project description) will always be the one
    i wrote in my html and will not change.

    What i am trying to achieve:
    While the information button itself should always stay the same, the text inside the modal should change depending on the project currently shown.

    What i tried:
    For now i am dealing with empty html tags and adding content via css using the pseudo class ::after.

    i also tried wordpress plugins for creating modals. after creating a modal one can use shortcode to implement it on a page. great! unfortunately this will not work, because it will be covered by my fixed menu bar on top.

    i am not asking for the code itself here. i am more interested in finding a user-friendly solution for implementing multiple modals. since i am not a web developer myself i am wondering how you would do this in a professional way.

    best regards!

    here is the code i used:

    this html goes at top:

    <button class="modal-button" data-modal-target="#modal"> information </button>
    <div class="modal" id="modal">
    <div class="modal-header">
     <div class="modal-title"></div>
     <button data-close-button class="close-button">×</button>
     </div>
     <div class="modal-body">
    

    this javascript goes at bottom:

    <script>
    
    const openModalButtons = document.querySelectorAll('[data-modal-target]')
    const closeModalButtons = document.querySelectorAll('[data-close-button]')
    const overlay = document.getElementById('overlay')
    
    openModalButtons.forEach(button => {
      button.addEventListener('click', () => {
        const modal = document.querySelector(button.dataset.modalTarget)
        openModal(modal)
      })
    })
    
    overlay.addEventListener('click', () => {
      const modals = document.querySelectorAll('.modal.active')
      modals.forEach(modal => {
        closeModal(modal)
      })
    })
    
    closeModalButtons.forEach(button => {
      button.addEventListener('click', () => {
        const modal = button.closest('.modal')
        closeModal(modal)
      })
    })
    
    function openModal(modal) {
      if (modal == null) return
      modal.classList.add('active')
      overlay.classList.add('active')
    }
    
    function closeModal(modal) {
      if (modal == null) return
      modal.classList.remove('active')
      overlay.classList.remove('active')
    }
    
    </script>
    

    custom css:

    .slug-objects .modal-title::after {
    	content:"objects";
    }
    .slug-objects .modal-body::after {
    	content:"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet..";
    }
    
    General Discussion

  • Responsive Image Carousel with fixed height
    E ErEs
    Sep 26, 2022, 12:09 PM

    okay i figured out what i needed was the "fullscreen slider" plugin by laytheme.
    turns out i did not activate it after installation... now it works fine!

    however i am still wondering how can i achieve the same "Give elements a max-width and max-height and center them" effect for single images, without a slider ?

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • Responsive Image Carousel with fixed height
    E ErEs
    Sep 26, 2022, 9:27 AM

    hello

    for my website i would like to have a responsive carousel with a fixed height (might as well be browser height), which does not change its height even if on smaller screensizes.

    exactly like done here: http://www.virgilijubero.com/lemaire/

    things i tried, that did not work:

    • "custom row height"

    • "browser height for row height"

    • applying a html class to my carousel and adjusting the height in css

    sometimes it looks good on desktop size screen but when resizing the browserwindow the size of my image will change as well e. g. it will stick to the top and there is lots of white space under it.

    any help is appreciated :)

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • accordeon
    E ErEs
    Sep 14, 2022, 12:02 PM

    Re: Accordion Bug

    hello, i managed to put an acordeon on my website using custom code.
    it is working, as long as i am on that site, where the acordeon is placed. when i navigate to a different (project-)site and come back the acordeon is always fully unfolded. there is still no way to close it in that situation, which normally works fine. the only thing that helps is refreshing the site.

    how can i fix it? is there something wrong with my code?
    -> www.sanderrobert.de/approaching-visual/

    <script>
    
     var toggleStates = [];
        var buttons = document.getElementsByClassName("panelbutton");
        var panels = document.getElementsByClassName("panel");
        
        function ApplyButtonState(index)
        {
            var panel = panels[index];
            
            if (toggleStates[index])
            {
                panel.style.maxHeight = '800px';
                panel.style.margin = null;
            }
            else
            {
                panel.style.maxHeight = 0;
                panel.style.margin = 0;
            }
        }
    
            
        if (buttons.length != panels.length)
        {
            console.error('panelbutton and panel count mismatch!');
        }
        else
        {
            for (var i = 0; i < buttons.length; i++) {
         
                var button = buttons[i];
                toggleStates.push(false);
                
                ApplyButtonState(i);
                    
                button.toggleStateIndex = i;
                button.addEventListener("click", function(evt) {
                        
                
                    for (var j = 0; j < toggleStates.length; j++)
                    {
                        var toggleStateIndex = evt.currentTarget.toggleStateIndex;
                        
                        var foldedOut = toggleStateIndex === j;
                        if (foldedOut && toggleStates[j])
                            foldedOut = false;
                   
                        toggleStates[j] = foldedOut;
                        ApplyButtonState(j);
                    }
             
                });
            }
        }
      
    
    </script>
    
    General Discussion

  • Custom circle cursor
    E ErEs
    Jan 11, 2022, 6:17 PM

    This would be interesting to know. Did you find a solution for this to work in laytheme?

    General Discussion

  • Custom Tag Filter
    E ErEs
    Jan 10, 2022, 4:17 PM

    Hello there,

    I'm looking for help with the new tag filter feature.
    I want to filter a collection of images.
    I have several main categories such as all, country, color and material.
    When all is selected, all images should appear but all tag filters should be hidden here. When I click on country it should as well show all objects but only those filters of different countries. Same goes for colors and so on...

    My main problem here is showing all images consequently as a default, while only filter sets are changing. Also images should not rearrange until a tag filter is applied.

    Any help is welcome.

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • Théo Marielle – Graphic Design Portfolio
    E ErEs
    Jan 10, 2022, 3:06 PM

    @TYLM said in Théo Marielle – Graphic Design Portfolio:

    https://theomarielle.com/

    Hey Théo. Great website! Looks stunning.
    I am currently working on a website with a similar filter system using the new filter tag option in lay theme. unfortunately it is not working the way i want right now so maybe you could help me out.

    1. how did you manage when clicking on a filter the whole filter set stays the same and wont rearrange, while still being combinable?

    2. how did you work out having categories, each one with different sub-categories (=tag filter)?

    thanks in advance.

    best

    Showcase

  • design and photography: portfolio website
    E ErEs
    Jul 4, 2021, 11:29 AM

    finished my portfolio website.
    first time fully responsive.
    i used laytheme add ons and custom coding.

    laytheme is a great platform. will definetly recommend.

    see my website here: www.sanderrobert.de

    Showcase

  • Custom cursor pointer for lightbox plugin
    E ErEs
    Jun 15, 2021, 10:28 AM

    Hello again,

    good news – i fixed it on my own.
    the use of "!important" was missing the whole time.
    I ll post the code i used down below in case anyone is struggling with a similar problem.

    .lightbox-css-on .grid-inner .col img{
        cursor: url(herewouldbemyurl) 40 40, auto !important;
    } 
    
    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • Custom cursor pointer for lightbox plugin
    E ErEs
    Jun 12, 2021, 1:07 PM

    Dear @Richard

    on my website i have a pink circle as custom cursor which changes to another pink form when hovering over clickable items (a, img a). this works totally fine.
    however when i hover over images which will open in lightbox, my cursor will not be displayed. the default pointer hand will be displayed instead.

    i checked my site code and was able to detect the css which makes it happen (see images). however i am not able to fix it. Bildschirmfoto 2021-06-12 um 15.00.05.png Bildschirmfoto 2021-06-12 um 15.00.26.png

    here are some lines of code i already tried:

    #lightbox-region{
        cursor: url(herewouldbemyurl)
    }
    
    body.lightbox-css-on img{
      cursor: url(herewouldbemyurl)
    }
    

    i also tried

    .pointer{
    display:none
    }
    
    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • Custom cursor pointer for lightbox plugin
    E ErEs
    Jun 11, 2021, 12:32 PM

    hey!

    i would love to change the default pointer for laytheme's lightbox plugin to my custom cursor.

    first i tried to style the pointer via css as a "normal" cursor and secondly tried to overwrite the code which activates the pointer on lightbox images by using a url to my custom cursor instead. neither of them worked.

    i guess it will be quite simple but for some reason i do not know how to get it to work.

    anybody knows a working solution?

    Need Custom Coding for Lay Theme? Find 3rd Party Developers here.

  • laytheme loading issues – frontend and backend
    E ErEs
    May 27, 2021, 12:48 PM

    Hey @Richard thank you for your quick response.
    i did as you told me and sent armin an email with all links provided.

    thanks for your help.

    Bug Reports

  • laytheme loading issues – frontend and backend
    E ErEs
    May 24, 2021, 9:57 AM

    update: i found my website working well without any loading issues on mobile devices. it only affects the desktop version.

    Bug Reports

I also code custom websites or custom Lay features.
💿 Email me here: 💿
info@laytheme.com

Before you post:
  1. When using a WordPress Cache plugin, disable it or clear your cache.
  2. Update Lay Theme and all Lay Theme Addons
  3. Disable all Plugins
  4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

This often solves issues you might run into

When you post:
  1. Post a link to where the problem is
  2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
  3. If the problem is difficult to explain, post screenshots / link to a video to explain it
Online Users
A
anagase
8 minutes ago
A
antonioprado
12 minutes ago
Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
laytheme.com
  • Login

  • Don't have an account? Register

  • Login or register to search.
  • First post
    Last post
0
  • Recent
  • Tags
  • Popular
  • Users
  • Search