Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • January 6, 2023 at 10:13 am #1377802
    oestersund

    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

    January 6, 2023 at 10:29 am #1377805
    Guenni007

    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

    January 6, 2023 at 10:42 am #1377806
    oestersund

    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, 11 months ago by oestersund.
    January 6, 2023 at 11:16 am #1377818
    Guenni007

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

    January 6, 2023 at 12:30 pm #1377830
    oestersund


    @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

    January 6, 2023 at 7:33 pm #1377885
    Guenni007

    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.

    January 7, 2023 at 12:12 pm #1377922
    oestersund

    @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, 11 months ago by oestersund.
    January 7, 2023 at 1:18 pm #1377930
    Guenni007

    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, 11 months ago by Guenni007.
    January 7, 2023 at 1:23 pm #1377931
    Guenni007

    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.

    January 7, 2023 at 2:37 pm #1377940
    oestersund

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

    Schönes WE!

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