Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1377802

    Dear team,
    for our recruitment we have apps. 20 open positions – ea. position specified on a single page or portfolio item.

    On a regular basis we have to change/actualize for whom we are searching for (active) or or not (inactive).

    On an overview page we show/teaser all open active jobs – like here: https://imgur.com/a/mONSuyA

    My idea was to use portfolio entries for each job using using categories “active” or “non active”. And the overview page shall only show the active items

    But with the “portfolio entries” function I can a not generate a list in order to. get something like on the screenshot (list with title & link only, but no image), right?

    What is your recommendation to realize the a.m. result?

    thx a lot & best regards Tilman

    #1377805

    Your idea seems to be good enough to fullfill your request.
    Don’t know why you can’t choose only the active “category” ( it is a taxonomy )
    Either in Portfolio Grid Element or even in blog-posts – there are options on that ( on blog-post you had to preselect the custom taxonomy option – then the “category” to show ( active one ).

    Edit: you only had to toggle the active / not-active category – and you can do that fast on Quick Edit

    #1377806

    Hi @guenni007,
    thx a lot for your fast info. Re taxonomy: Yes, thats clear and thats why I thought to use portfolio item with active/inactive category.

    The main question is still: How can I generate/ configure the list on the job overview page in order to get a result similar as in the screenshot? I did not find this in the “portfolio grid” options acc.

    • This reply was modified 1 year, 10 months ago by oestersund.
    #1377818

    yes the portfolio-grid only got this grid layout option!
    Take the magazine element :

    #1377830


    @Guenni007
    thx a lot – In terms of creating a portfolio entries list this is great. This was an alternative I did not think of.

    But the magazine list does not allow to customize colors with alternating background colors per entry in order to distinguish the entries better, right? At least I did not find a CSS or so acc.

    -> I you have an idea, this would be great

    And neither I did find a way to add a symbol (wich is not that important)

    pls see: as is (magazine entries list via enfold) and shall be (current typo3 page) below: https://imgur.com/a/aSPiXtR

    #1377885

    and what about the selectors with nth-of-child or even better nth-of-type :

    #top .av-magazine-group .av-magazine-entry:nth-of-type(odd) {
      background: #eee;
    }
    #top .av-magazine-group .av-magazine-entry:nth-of-type(even) {
      background: #ccc;
    }

    of if some brosers will have trouble with odd/even:

    #top .av-magazine-group .av-magazine-entry:nth-of-type(2n) {
      background: #eee;
    }
    
    #top .av-magazine-group .av-magazine-entry:nth-of-type(2n+1) {
      background: #ccc;
    }

    see at the bottom of that page: https://webers-testseite.de/portfolio/

    PS : you can replace the img’s by entypo fontello icons.

    #1377922

    @Guenni007: Vielen Dank, das kannte ich nicht – funktioniert :-)
    Danke auch für den Link – Genauso brauche ich die Darstellung.

    -> Ein CSS um das Padding der einzelnen Einträge zu erhöhen habe ich probiert, aber nicht funktioniert – wie hast Du das gelöst?
    -> Und wie bekomme ich die Icons dort hinein? In meiner MagazinListe mit den Portfolio items nehme ich die Titelüberschriften der Portfolio Einträge und das ist ja jeweils Text.

    Beste Grüße! Tilman

    • This reply was modified 1 year, 10 months ago by oestersund.
    #1377930

    Das sind meine CSS für die Seite :

    #top.page-id-2623 .av-magazine-group .av-magazine-entry {
      padding: 10px;
      border-radius: 8px;
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry:nth-of-type(2n) {
      background: #eee;
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry:nth-of-type(2n+1) {
      background: #ccc;
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry .av-magazine-content-wrap {
      border-bottom: none
    }
    
    #top.page-id-2623  .av-magazine header {
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
    }
    
    #top.page-id-2623  .av-magazine-thumbnail-link {
      display: table;
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry .av-magazine-thumbnail-link img {
     display :none
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry .av-magazine-thumbnail .av-magazine-thumbnail-link:before {
      font-family: entypo-fontello;
      font-size: 40px;
      line-height: 50px;
      position: absolute;
      top: 0;
      left: 5px;
      width: 100%;
      height: 100%;
      display: block;
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry:nth-of-type(2n+1) .av-magazine-thumbnail .av-magazine-thumbnail-link:before {
     content: "\e80c";
     color:#333
    }
    
    #top.page-id-2623 .av-magazine-group .av-magazine-entry:nth-of-type(2n) .av-magazine-thumbnail .av-magazine-thumbnail-link:before {
     content: "\e80b";
     color:#666
    }
    • This reply was modified 1 year, 10 months ago by Guenni007.
    #1377931

    Wenn du die Zeit ( av-magazine-time ) gerne mit drin hast , dann steht die leider über dem Title – daher habe ich die Position mittels jQuery getauscht.
    Ich habe das Display: none mal wieder rausgenommen auf der Beispielseite, damit du siehst was ich meine:

    function change_position() { 
    if(is_page(2623)){
    ?>
    <script>
    window.addEventListener("DOMContentLoaded", function () { 
    	(function($){
    		$('.entry-content-header').each(function() {
    			var movedElement = $(this).find('.av-magazine-title.entry-title');
    			var targetElement = $(this).find('.av-magazine-time');
    			if(targetElement.length){
    				$(movedElement).insertBefore($(targetElement));
    			};
    		});
    	})(jQuery);
    });
    </script>
    <?php
    }
    }
    add_action('wp_footer', 'change_position');

    eventuell wäre es sogar besser, das als child-theme magazine.php zu fahren. Und die av-magazine-time dort unterhalb des titles zu setzen.

    #1377940

    @Guenni007: Besten Dank, da gucke ich gern, was davon für mich relevant ist / funktioniert.

    Schönes WE!

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.