{"id":12211,"date":"2025-12-19T14:34:49","date_gmt":"2025-12-19T14:34:49","guid":{"rendered":"https:\/\/cmacademy.events\/?post_type=ht_kb&#038;p=12211"},"modified":"2026-08-14T13:55:44","modified_gmt":"2026-08-14T13:55:44","slug":"inspirationsbibliotek-for-webbplatser","status":"publish","type":"ht_kb","link":"https:\/\/cmacademy.events\/sv\/knowledge-base\/inspirationsbibliotek-for-webbplatser\/","title":{"rendered":"Inspirationsbibliotek f\u00f6r webbplatser"},"content":{"rendered":"\n<style>\n  \/* ------------------------------------------------------------\n     Inspirationsbibliotek f\u00f6r webbplatser\n     Fem evenemangsexempel med Tema A, B och C\n  ------------------------------------------------------------ *\/\n\n  .cm-inspiration-page,\n  .cm-inspiration-page * {\n    box-sizing: border-box !important;\n    font-family: \"Titillium Web\", sans-serif !important;\n  }\n\n  .cm-inspiration-page {\n    width: 100% !important;\n    max-width: 1260px !important;\n    margin: 1.1rem 0 2.5rem 0 !important;\n    padding: 0 !important;\n  }\n\n  \/* Intro *\/\n\n  .cm-inspiration-intro {\n    max-width: 1080px !important;\n    margin: 0 0 1.8rem 0 !important;\n    padding: 0 !important;\n    background: transparent !important;\n    border: 0 !important;\n    border-radius: 0 !important;\n    box-shadow: none !important;\n  }\n\n  .cm-inspiration-intro-title {\n    color: #1F354D !important;\n    font-size: 24px !important;\n    font-weight: 600 !important;\n    line-height: 1.25 !important;\n    margin: 0 0 0.65rem 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-intro p {\n    max-width: 1040px !important;\n    color: #24384D !important;\n    font-size: 17px !important;\n    line-height: 1.58 !important;\n    margin: 0 0 0.75rem 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-intro p:last-child {\n    margin-bottom: 0 !important;\n  }\n\n  \/* Theme grid *\/\n\n  .cm-theme-grid {\n    display: grid !important;\n    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;\n    column-gap: 1.1rem !important;\n    row-gap: 1.15rem !important;\n    width: 100% !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    align-items: stretch !important;\n  }\n\n  \/* F\u00f6rsta raden: de tv\u00e5 exemplen med Tema A *\/\n  .cm-theme-card:nth-child(1),\n  .cm-theme-card:nth-child(2) {\n    grid-column: span 3 !important;\n  }\n\n  \/* Andra raden: Tema B + de tv\u00e5 exemplen med Tema C *\/\n  .cm-theme-card:nth-child(n+3) {\n    grid-column: span 2 !important;\n  }\n\n  .cm-theme-card {\n    position: relative !important;\n    display: flex !important;\n    flex-direction: column !important;\n    min-width: 0 !important;\n    min-height: 365px !important;\n    padding: 1.2rem !important;\n    border-radius: 16px !important;\n    overflow: hidden !important;\n    transition:\n      transform 0.2s ease,\n      border-color 0.2s ease,\n      box-shadow 0.2s ease !important;\n  }\n\n  .cm-theme-card:hover {\n    transform: translateY(-2px) !important;\n    box-shadow: 0 15px 32px rgba(18, 32, 46, 0.075) !important;\n  }\n\n  .cm-theme-a {\n    background:\n      radial-gradient(\n        circle at 100% 0%,\n        rgba(24, 90, 188, 0.085) 0,\n        rgba(24, 90, 188, 0) 44%\n      ),\n      #ffffff !important;\n    border: 1px solid rgba(24, 90, 188, 0.24) !important;\n  }\n\n  .cm-theme-b {\n    background:\n      radial-gradient(\n        circle at 100% 0%,\n        rgba(156, 204, 61, 0.11) 0,\n        rgba(156, 204, 61, 0) 44%\n      ),\n      #f8fcff !important;\n    border: 1px solid rgba(156, 204, 61, 0.42) !important;\n  }\n\n  .cm-theme-c {\n    background:\n      radial-gradient(\n        circle at 100% 0%,\n        rgba(31, 53, 77, 0.075) 0,\n        rgba(31, 53, 77, 0) 44%\n      ),\n      #ffffff !important;\n    border: 1px solid rgba(31, 53, 77, 0.2) !important;\n  }\n\n  .cm-theme-top {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: space-between !important;\n    gap: 1rem !important;\n    margin: 0 0 1rem 0 !important;\n  }\n\n  .cm-theme-label {\n    display: inline-flex !important;\n    align-items: center !important;\n    min-height: 25px !important;\n    padding: 0.18rem 0.68rem !important;\n    border-radius: 999px !important;\n    font-size: 12px !important;\n    font-weight: 700 !important;\n    line-height: 1.1 !important;\n    letter-spacing: 0.04em !important;\n    text-transform: uppercase !important;\n  }\n\n  .cm-theme-a .cm-theme-label {\n    background: rgba(24, 90, 188, 0.09) !important;\n    color: #185ABC !important;\n  }\n\n  .cm-theme-b .cm-theme-label {\n    background: rgba(156, 204, 61, 0.17) !important;\n    color: #74B51C !important;\n  }\n\n  .cm-theme-c .cm-theme-label {\n    background: rgba(31, 53, 77, 0.08) !important;\n    color: #1F354D !important;\n  }\n\n  .cm-theme-letter {\n    display: inline-flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    flex: 0 0 auto !important;\n    width: 44px !important;\n    height: 44px !important;\n    border-radius: 13px !important;\n    color: #ffffff !important;\n    font-size: 22px !important;\n    font-weight: 700 !important;\n    line-height: 1 !important;\n    box-shadow: 0 7px 16px rgba(18, 32, 46, 0.09) !important;\n  }\n\n  .cm-theme-a .cm-theme-letter {\n    background: #185ABC !important;\n  }\n\n  .cm-theme-b .cm-theme-letter {\n    background: #9CCC3D !important;\n  }\n\n  .cm-theme-c .cm-theme-letter {\n    background: #1F354D !important;\n  }\n\n  .cm-theme-title {\n    color: #1F354D !important;\n    font-size: 22px !important;\n    font-weight: 600 !important;\n    line-height: 1.22 !important;\n    margin: 0 0 0.55rem 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-page .cm-theme-card .cm-theme-summary {\n    color: #24384D !important;\n    font-size: 13.5px !important;\n    line-height: 1.45 !important;\n    font-weight: 400 !important;\n    margin: 0 !important;\n    padding: 0 !important;\n  }\n\n  \/* Highlights *\/\n\n  .cm-theme-highlights {\n    display: grid !important;\n    gap: 0.48rem !important;\n    margin: 0.9rem 0 0 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-page .cm-theme-card .cm-theme-highlight {\n    display: grid !important;\n    grid-template-columns: auto minmax(0, 1fr) !important;\n    align-items: start !important;\n    gap: 0.5rem !important;\n    color: #425A70 !important;\n    font-size: 12.5px !important;\n    font-weight: 600 !important;\n    line-height: 1.36 !important;\n  }\n\n  .cm-inspiration-page .cm-theme-card .cm-theme-highlight > span:last-child {\n    display: block !important;\n    line-height: 1.36 !important;\n  }\n\n  .cm-theme-highlight-dot {\n    width: 7px !important;\n    height: 7px !important;\n    margin-top: 0 !important;\n    align-self: start !important;\n    transform: translateY(0.38em) !important;\n    border-radius: 50% !important;\n    background: #9CCC3D !important;\n  }\n\n  \/* Extra-specific selectors to override WordPress\/global paragraph styling *\/\n  .cm-inspiration-page .cm-theme-card p.cm-theme-ai-note {\n    margin: 0.7rem 0 0 0 !important;\n    padding: 0.32rem 0.45rem !important;\n    border-left: 2px solid #9CCC3D !important;\n    border-radius: 0 5px 5px 0 !important;\n    background: rgba(156, 204, 61, 0.07) !important;\n    color: #425A70 !important;\n    font-size: 9.5px !important;\n    font-weight: 400 !important;\n    line-height: 1.28 !important;\n  }\n\n  .cm-inspiration-page .cm-theme-card p.cm-theme-ai-note strong,\n  .cm-inspiration-page .cm-theme-card p.cm-theme-ai-note span {\n    font-size: 9.5px !important;\n    line-height: 1.28 !important;\n  }\n\n  .cm-inspiration-page .cm-theme-card p.cm-theme-ai-note strong {\n    color: #1F354D !important;\n    font-weight: 700 !important;\n  }\n\n  .cm-theme-spacer {\n    flex: 1 1 auto !important;\n    min-height: 1.1rem !important;\n  }\n\n  \/* Buttons *\/\n\n  .cm-theme-card a.cm-theme-button,\n  .cm-theme-card a.cm-theme-button:visited {\n    display: inline-flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    width: 154px !important;\n    min-height: 41px !important;\n    padding: 0.58rem 0.95rem !important;\n    border-radius: 10px !important;\n    background: #ffffff !important;\n    background-color: #ffffff !important;\n    box-shadow: none !important;\n    font-size: 15px !important;\n    font-weight: 700 !important;\n    line-height: 1.2 !important;\n    text-decoration: none !important;\n    transition: 0.2s ease !important;\n  }\n\n  .cm-theme-a a.cm-theme-button,\n  .cm-theme-a a.cm-theme-button:visited {\n    color: #185ABC !important;\n    border: 1px solid #185ABC !important;\n  }\n\n  .cm-theme-a a.cm-theme-button:hover,\n  .cm-theme-a a.cm-theme-button:focus,\n  .cm-theme-a a.cm-theme-button:active {\n    background: #185ABC !important;\n    background-color: #185ABC !important;\n    color: #ffffff !important;\n    border-color: #185ABC !important;\n    outline: none !important;\n  }\n\n  .cm-theme-c a.cm-theme-button,\n  .cm-theme-c a.cm-theme-button:visited {\n    color: #1F354D !important;\n    border: 1px solid #1F354D !important;\n  }\n\n  .cm-theme-c a.cm-theme-button:hover,\n  .cm-theme-c a.cm-theme-button:focus,\n  .cm-theme-c a.cm-theme-button:active {\n    background: #1F354D !important;\n    background-color: #1F354D !important;\n    color: #ffffff !important;\n    border-color: #1F354D !important;\n    outline: none !important;\n  }\n\n  .cm-theme-b a.cm-theme-button,\n  .cm-theme-b a.cm-theme-button:visited {\n    color: #74B51C !important;\n    border: 1px solid #9CCC3D !important;\n  }\n\n  .cm-theme-b a.cm-theme-button:hover,\n  .cm-theme-b a.cm-theme-button:focus,\n  .cm-theme-b a.cm-theme-button:active {\n    background: #9CCC3D !important;\n    background-color: #9CCC3D !important;\n    color: #ffffff !important;\n    border-color: #9CCC3D !important;\n    outline: none !important;\n  }\n\n  \/* Learn more *\/\n\n  .cm-inspiration-learn {\n    display: grid !important;\n    grid-template-columns: minmax(0, 1fr) auto !important;\n    align-items: center !important;\n    gap: 1.4rem !important;\n    width: 100% !important;\n    margin: 1.15rem 0 0 0 !important;\n    padding: 1.2rem 1.35rem !important;\n    border: 1px solid rgba(24, 90, 188, 0.17) !important;\n    border-radius: 15px !important;\n    background:\n      linear-gradient(\n        135deg,\n        rgba(24, 90, 188, 0.045) 0%,\n        rgba(156, 204, 61, 0.075) 100%\n      ) !important;\n  }\n\n  .cm-inspiration-learn-title {\n    color: #1F354D !important;\n    font-size: 20px !important;\n    font-weight: 600 !important;\n    line-height: 1.25 !important;\n    margin: 0 0 0.3rem 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-learn p {\n    color: #425A70 !important;\n    font-size: 15.5px !important;\n    line-height: 1.5 !important;\n    margin: 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-actions {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: flex-end !important;\n    flex-wrap: wrap !important;\n    gap: 0.7rem !important;\n  }\n\n  .cm-inspiration-actions a,\n  .cm-inspiration-actions a:visited {\n    display: inline-flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    min-height: 39px !important;\n    padding: 0.52rem 0.9rem !important;\n    border-radius: 9px !important;\n    background: #ffffff !important;\n    font-size: 14.5px !important;\n    font-weight: 700 !important;\n    line-height: 1.2 !important;\n    text-decoration: none !important;\n    transition: 0.2s ease !important;\n  }\n\n  .cm-inspiration-video-link,\n  .cm-inspiration-video-link:visited,\n  .cm-inspiration-guide-link,\n  .cm-inspiration-guide-link:visited {\n    color: #185ABC !important;\n    border: 1px solid #185ABC !important;\n  }\n\n  .cm-inspiration-video-link:hover,\n  .cm-inspiration-video-link:focus,\n  .cm-inspiration-video-link:focus-visible,\n  .cm-inspiration-video-link:active,\n  .cm-inspiration-guide-link:hover,\n  .cm-inspiration-guide-link:focus,\n  .cm-inspiration-guide-link:focus-visible,\n  .cm-inspiration-guide-link:active {\n    background: #ffffff !important;\n    background-color: #ffffff !important;\n    color: #74B51C !important;\n    border-color: #9CCC3D !important;\n    text-decoration: none !important;\n    outline: none !important;\n  }\n\n  \/* Graphic design inspiration *\/\n\n  .cm-inspiration-graphics {\n    display: grid !important;\n    grid-template-columns: minmax(0, 1fr) auto !important;\n    align-items: center !important;\n    gap: 1.4rem !important;\n    width: 100% !important;\n    margin: 0.85rem 0 0 0 !important;\n    padding: 1.2rem 1.35rem !important;\n    border: 1px solid rgba(156, 204, 61, 0.34) !important;\n    border-radius: 15px !important;\n    background:\n      radial-gradient(\n        circle at 100% 0%,\n        rgba(156, 204, 61, 0.13) 0,\n        rgba(156, 204, 61, 0) 42%\n      ),\n      #ffffff !important;\n  }\n\n  .cm-inspiration-graphics-title {\n    color: #1F354D !important;\n    font-size: 20px !important;\n    font-weight: 600 !important;\n    line-height: 1.25 !important;\n    margin: 0 0 0.3rem 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-graphics p {\n    max-width: 900px !important;\n    color: #425A70 !important;\n    font-size: 15.5px !important;\n    line-height: 1.5 !important;\n    margin: 0 !important;\n    padding: 0 !important;\n  }\n\n  .cm-inspiration-graphics .cm-inspiration-ai-note {\n    max-width: 860px !important;\n    margin: 0.7rem 0 0 0 !important;\n    padding: 0.55rem 0.7rem !important;\n    border-left: 3px solid #9CCC3D !important;\n    border-radius: 0 7px 7px 0 !important;\n    background: rgba(156, 204, 61, 0.08) !important;\n    color: #425A70 !important;\n    font-size: 13px !important;\n    line-height: 1.4 !important;\n  }\n\n  .cm-inspiration-graphics .cm-inspiration-ai-note strong {\n    color: #1F354D !important;\n    font-weight: 700 !important;\n  }\n\n  .cm-inspiration-graphics a.cm-inspiration-graphics-link,\n  .cm-inspiration-graphics a.cm-inspiration-graphics-link:visited {\n    display: inline-flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    min-height: 39px !important;\n    padding: 0.52rem 0.9rem !important;\n    border-radius: 9px !important;\n    background: #ffffff !important;\n    background-color: #ffffff !important;\n    color: #74B51C !important;\n    border: 1px solid #9CCC3D !important;\n    box-shadow: none !important;\n    font-size: 14.5px !important;\n    font-weight: 700 !important;\n    line-height: 1.2 !important;\n    text-decoration: none !important;\n    white-space: nowrap !important;\n    transition: 0.2s ease !important;\n  }\n\n  .cm-inspiration-graphics a.cm-inspiration-graphics-link:hover,\n  .cm-inspiration-graphics a.cm-inspiration-graphics-link:focus,\n  .cm-inspiration-graphics a.cm-inspiration-graphics-link:focus-visible,\n  .cm-inspiration-graphics a.cm-inspiration-graphics-link:active {\n    background: #ffffff !important;\n    background-color: #ffffff !important;\n    color: #185ABC !important;\n    border-color: #185ABC !important;\n    text-decoration: none !important;\n    outline: none !important;\n  }\n\n  @media (max-width: 1100px) {\n    .cm-theme-grid {\n      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\n    }\n\n    .cm-theme-card,\n    .cm-theme-card:nth-child(1),\n    .cm-theme-card:nth-child(2),\n    .cm-theme-card:nth-child(n+3) {\n      grid-column: auto !important;\n      min-height: 350px !important;\n    }\n  }\n\n  @media (max-width: 760px) {\n    .cm-theme-grid {\n      grid-template-columns: 1fr !important;\n    }\n\n    .cm-theme-card,\n    .cm-theme-card:nth-child(1),\n    .cm-theme-card:nth-child(2),\n    .cm-theme-card:nth-child(n+3) {\n      grid-column: auto !important;\n      min-height: 0 !important;\n    }\n\n    .cm-inspiration-learn,\n    .cm-inspiration-graphics {\n      grid-template-columns: 1fr !important;\n    }\n\n    .cm-inspiration-actions {\n      justify-content: flex-start !important;\n    }\n\n    .cm-inspiration-graphics a.cm-inspiration-graphics-link {\n      width: fit-content !important;\n    }\n  }\n\n  @media (max-width: 600px) {\n    .cm-inspiration-page {\n      margin: 1rem 0 2rem 0 !important;\n    }\n\n    .cm-inspiration-intro {\n      margin-bottom: 1.5rem !important;\n      padding: 0 !important;\n    }\n\n    .cm-inspiration-intro-title {\n      font-size: 22px !important;\n    }\n\n    .cm-inspiration-intro p {\n      font-size: 16px !important;\n    }\n\n    .cm-theme-card {\n      padding: 1.2rem !important;\n    }\n\n    .cm-theme-title {\n      font-size: 21px !important;\n    }\n\n    .cm-theme-card a.cm-theme-button {\n      width: 100% !important;\n    }\n\n    .cm-inspiration-actions {\n      display: grid !important;\n      grid-template-columns: 1fr !important;\n    }\n\n    .cm-inspiration-actions a,\n    .cm-inspiration-graphics a.cm-inspiration-graphics-link {\n      width: 100% !important;\n    }\n  }\n<\/style>\n\n<div class=\"cm-inspiration-page\">\n\n  <section class=\"cm-inspiration-intro\">\n    <div class=\"cm-inspiration-intro-title\">\n      Utforska olika s\u00e4tt att bygga en webbplats f\u00f6r ditt evenemang\n    <\/div>\n\n    <p>\n      De h\u00e4r inspirationsevenemangen visar hur Tema A, Tema B och Tema C kan anv\u00e4ndas f\u00f6r att skapa olika layouter, strukturer och visuella uttryck med samma funktioner i Conference Manager. De tv\u00e5 f\u00f6rsta exemplen \u00e4r b\u00e5da byggda med Tema A och visar hur olika samma tema kan utformas.\n    <\/p>\n\n    <p>\n      Du f\u00e5r g\u00e4rna anm\u00e4la dig till evenemangen och uppleva hela deltagarfl\u00f6det, inklusive webbplats, program, anm\u00e4lan och bekr\u00e4ftelsekommunikation.\n    <\/p>\n  <\/section>\n\n  <div class=\"cm-theme-grid\" aria-label=\"Exempel p\u00e5 webbplatsteman\">\n\n    <!-- Tema A - n\u00e4tverkskonferens -->\n    <article class=\"cm-theme-card cm-theme-a\">\n      <div class=\"cm-theme-top\">\n        <span class=\"cm-theme-label\">Tema A<\/span>\n        <span class=\"cm-theme-letter\" aria-hidden=\"true\">A<\/span>\n      <\/div>\n\n      <div class=\"cm-theme-title\">\n        N\u00e4tverkskonferens med tydlig visuell identitet\n      <\/div>\n\n      <p class=\"cm-theme-summary\">\n        Det h\u00e4r exemplet visar hur Tema A kan anv\u00e4ndas f\u00f6r att skapa en professionell konferenswebbplats med en stark visuell identitet, tydlig navigation och separata sidor f\u00f6r den viktigaste informationen om evenemanget.\n      <\/p>\n\n      <div class=\"cm-theme-highlights\">\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Stor toppsektion med tydlig visuell identitet och en klar uppmaning till anm\u00e4lan<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Separata sidor f\u00f6r talare och information om platsen<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Anpassade bildformer och en konsekvent marinbl\u00e5 och gr\u00f6n stil<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"cm-theme-spacer\"><\/div>\n\n      <a\n        href=\"https:\/\/conferencemanager.events\/networkingconference-2028\/conference\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        class=\"cm-theme-button\"\n      >\n        Visa evenemang\n      <\/a>\n    <\/article>\n\n    <!-- Tema A - internationell konferens -->\n    <article class=\"cm-theme-card cm-theme-a\">\n      <div class=\"cm-theme-top\">\n        <span class=\"cm-theme-label\">Tema A<\/span>\n        <span class=\"cm-theme-letter\" aria-hidden=\"true\">A<\/span>\n      <\/div>\n\n      <div class=\"cm-theme-title\">\n        Stor internationell konferens\n      <\/div>\n\n      <p class=\"cm-theme-summary\">\n        Det h\u00e4r exemplet anv\u00e4nder samma tema i en m\u00f6rk visuell stil och visar hur en internationell konferens \u00f6ver fyra dagar kan presenteras med nyckeltal, talarprofiler och ett detaljerat program.\n      <\/p>\n\n      <div class=\"cm-theme-highlights\">\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>M\u00f6rkt f\u00e4rgschema med gulddetaljer och bilder i full bredd<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Nyckeltal, talarprofiler och ett program dag f\u00f6r dag<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Merchandise och tj\u00e4nster som erbjuds under registreringen<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"cm-theme-spacer\"><\/div>\n\n      <a\n        href=\"https:\/\/conferencemanager.events\/internationalconference2030inspirationevent\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        class=\"cm-theme-button\"\n      >\n        Visa evenemang\n      <\/a>\n    <\/article>\n\n    <!-- Tema B -->\n    <article class=\"cm-theme-card cm-theme-b\">\n      <div class=\"cm-theme-top\">\n        <span class=\"cm-theme-label\">Tema B<\/span>\n        <span class=\"cm-theme-letter\" aria-hidden=\"true\">B<\/span>\n      <\/div>\n\n      <div class=\"cm-theme-title\">\n        Workshoppar och flera datum\n      <\/div>\n\n      <p class=\"cm-theme-summary\">\n        Det h\u00e4r exemplet visar olika workshopteman, d\u00e4r varje datum \u00e4r kopplat till en egen dold deltagarkategori via en l\u00e4nk med evenemangskod.\n      <\/p>\n\n      <div class=\"cm-theme-highlights\">\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Flera workshoppar i samma evenemangsinst\u00e4llning<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Dolda deltagarkategorier<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Direktanm\u00e4lan via l\u00e4nkar med evenemangskod<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"cm-theme-spacer\"><\/div>\n\n      <a\n        href=\"https:\/\/www.conferencemanager.dk\/workshopsforall\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        class=\"cm-theme-button\"\n      >\n        Visa evenemang\n      <\/a>\n    <\/article>\n\n    <!-- Tema C -->\n    <article class=\"cm-theme-card cm-theme-c\">\n      <div class=\"cm-theme-top\">\n        <span class=\"cm-theme-label\">Tema C<\/span>\n        <span class=\"cm-theme-letter\" aria-hidden=\"true\">C<\/span>\n      <\/div>\n\n      <div class=\"cm-theme-title\">\n        Visuell design och konsekvens\n      <\/div>\n\n      <p class=\"cm-theme-summary\">\n        Det h\u00e4r exemplet fokuserar p\u00e5 avst\u00e5nd, justering och en konsekvent gr\u00f6n och vit design, kompletterad med grafik och animerade GIF-filer som har skapats i Canva.\n      <\/p>\n\n      <div class=\"cm-theme-highlights\">\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Konsekventa avst\u00e5nd och tydlig visuell hierarki<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Program h\u00e4mtat fr\u00e5n evenemangsinst\u00e4llningarna<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Canva-grafik, GIF-filer och l\u00e4nkade bilder<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"cm-theme-spacer\"><\/div>\n\n      <a\n        href=\"https:\/\/conferencemanager.events\/professionaldevelopmentday\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        class=\"cm-theme-button\"\n      >\n        Visa evenemang\n      <\/a>\n    <\/article>\n\n    <!-- Tema C - Leadership of Tomorrow -->\n    <article class=\"cm-theme-card cm-theme-c\">\n      <div class=\"cm-theme-top\">\n        <span class=\"cm-theme-label\">Tema C<\/span>\n        <span class=\"cm-theme-letter\" aria-hidden=\"true\">C<\/span>\n      <\/div>\n\n      <div class=\"cm-theme-title\">\n        Visuell navigation och anpassad grafik\n      <\/div>\n\n      <p class=\"cm-theme-summary\">\n        Det h\u00e4r exemplet visar hur Tema C kan kombinera anpassad grafik, inklusive grafik skapad med AI-verktyg, med interaktiva element fr\u00e5n Conference Manager. Bilder anv\u00e4nds ocks\u00e5 som klickbar navigation till separata sidor som inte visas i huvudmenyn.\n      <\/p>\n\n      <div class=\"cm-theme-highlights\">\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Anpassad och AI-genererad grafik som webbplatselement<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Klickbara bilder med l\u00e4nkar till separata sidor f\u00f6r talare<\/span>\n        <\/div>\n\n        <div class=\"cm-theme-highlight\">\n          <span class=\"cm-theme-highlight-dot\" aria-hidden=\"true\"><\/span>\n          <span>Grafik kombinerad med interaktiva element fr\u00e5n Conference Manager<\/span>\n        <\/div>\n      <\/div>\n\n      <p class=\"cm-theme-ai-note\">\n        <strong>Observera:<\/strong> Undvik att dela personliga eller konfidentiella uppgifter med AI-verktyg. L\u00e4gg till namn i efterhand i ett designverktyg vid behov.\n      <\/p>\n\n      <div class=\"cm-theme-spacer\"><\/div>\n\n      <a\n        href=\"https:\/\/www.conferencemanager.dk\/leadershipoftomorrow2027\/conference\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        class=\"cm-theme-button\"\n      >\n        Visa evenemang\n      <\/a>\n    <\/article>\n\n  <\/div>\n\n  <aside class=\"cm-inspiration-learn\">\n    <div>\n      <div class=\"cm-inspiration-learn-title\">\n        Vill du l\u00e4ra dig mer?\n      <\/div>\n\n      <p>\n        Se introduktionen till Website Designer eller f\u00f6lj steg-f\u00f6r-steg-guiden f\u00f6r att l\u00e4ra dig hur du l\u00e4gger till och hanterar element.\n      <\/p>\n    <\/div>\n\n    <div class=\"cm-inspiration-actions\">\n      <a\n        href=\"https:\/\/cmacademy.events\/sv\/knowledge-base\/online-introduction-to-website-designer\/\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        class=\"cm-inspiration-video-link\"\n      >\n        Se introduktion\n      <\/a>\n\n      <a\n        href=\"https:\/\/cmacademy.events\/sv\/knowledge-base\/insert-elements-in-the-website-designer\/\"\n        class=\"cm-inspiration-guide-link\"\n      >\n        \u00d6ppna guide\n      <\/a>\n    <\/div>\n  <\/aside>\n\n  <aside class=\"cm-inspiration-graphics\">\n    <div>\n      <div class=\"cm-inspiration-graphics-title\">\n        Letar du efter inspiration till grafiken p\u00e5 din webbplats?\n      <\/div>\n\n      <p>\n        Se hur Canva och andra externa designverktyg kan anv\u00e4ndas f\u00f6r att skapa professionell grafik, anpassade bildformer, animerade GIF-filer och andra visuella element till din evenemangswebbplats.\n      <\/p>\n    <\/div>\n\n    <a\n      href=\"https:\/\/cmacademy.events\/sv\/knowledge-base\/how-to-design-a-professional-website-for-your-event-with-conference-manager-and-graphic-tools\/\"\n      class=\"cm-inspiration-graphics-link\"\n    >\n      Visa artikel\n    <\/a>\n  <\/aside>\n\n<\/div>\n\n","protected":false},"excerpt":{"rendered":"<p>Utforska olika s\u00e4tt att bygga en webbplats f\u00f6r ditt evenemang De h\u00e4r inspirationsevenemangen visar hur Tema A, Tema B och Tema C kan anv\u00e4ndas f\u00f6r att skapa olika layouter, strukturer och visuella uttryck med samma funktioner i Conference Manager. De tv\u00e5 f\u00f6rsta exemplen \u00e4r b\u00e5da byggda med Tema A och visar hur olika samma tema &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/cmacademy.events\/sv\/knowledge-base\/inspirationsbibliotek-for-webbplatser\/\" class=\"more-link\">Forts\u00e4tt l\u00e4sa<span class=\"screen-reader-text\"> \u201dInspirationsbibliotek f\u00f6r webbplatser\u201d<\/span><\/a><\/p>\n","protected":false},"author":6,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"footnotes":""},"ht-kb-category":[475],"ht-kb-tag":[92,5779],"class_list":{"0":"post-12211","1":"ht_kb","2":"type-ht_kb","3":"status-publish","4":"format-standard","5":"hentry","6":"ht_kb_category-inspiration-sv","7":"ht_kb_tag-website","9":"entry"},"_links":{"self":[{"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/ht-kb\/12211","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/comments?post=12211"}],"version-history":[{"count":9,"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/ht-kb\/12211\/revisions"}],"predecessor-version":[{"id":18931,"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/ht-kb\/12211\/revisions\/18931"}],"wp:attachment":[{"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/media?parent=12211"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/ht-kb-category?post=12211"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/cmacademy.events\/sv\/wp-json\/wp\/v2\/ht-kb-tag?post=12211"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}