I Min Speiding kan gruppene lage sitt eget elektroniske skjema hvor nye speidere kan melde seg inn selv.

1. Hvordan fungerer det?

Speideren klikker på en lenke på gruppens hjemmeside og blir videresendt til et skjema. Der fyller speideren inn navn, epost, fødselsdato, etc selv. Når skjemaet er fylt ut og sendt inn, sendes det en mail til en i speidergruppa. Da kan man velge mellom å godkjenne medlemmet, avslå medlemmet eller sette han/hun på venteliste.

2. Hvordan lager jeg skjemaet?

2.1. Gå til Webbtjenester-fanen til gruppa.

Webbtjenester-fanen har den med rollen IT-ansvarlig tilgang til. Hvis ingen har denne rollen må gruppeleder eller annen med tilgang å redigere roller tildele rollen IT-ansvarlig til den som skal administrere instillingene for webbtjenester (Innmeldingsskjema og API).

2.2. Under "Innstillinger for offentlig registrering", gjør følgende:



Aktivert
Huk av.

Bekreftelsesmelding
Skriv en velkomstmelding

External CSS og Inline CSS
Her kan du kan personalisere skjemaet. (Vi kommer tilbake til CSS lenger nede i veiledningen)

Kontaktfelt
Spør om kontaktinformasjon. Vi foreslår å skrive fars navn, fars mobil, fars e-post, mors navn, mors mobil, mors e-post og mobilnummer i dette feltet.

Egendefinerte felt
Her kan du legge til egne spørsmål. OBS! Det er ikke anledning til å be om sensitiv informasjon eller informasjon som ikke aboslutt er nødvendig for medlemsskapet!
Denne funksjonen er under avvikling!

Varsle roller
Velg hvilke roller som skal få e-post når noen har sendt skjemaet. Kan f.eks. være "Medlemstilgang - gruppe" eller "Gruppesekretær".

E-postvarsel (en per linje)
Hvis du vil skrive inn hvilke e-postadresser som skal varsles når skjemaet har blitt sendt i steden for roller, kan du spesifisere de her.

Destinasjonsliste
Her kan du velge hva som skal skje med medlemmet. Det kan enten avvente godkjenning eller gå rett til venteliste.

2.3. Publiser skjemaet!

Under eksempler er det forskjellige lenker som er ferdige for bruk av din gruppe dersom dere har satt opp ovenstående innstillinger. Disse kan brukes direkte i nettleser på PC, telefon eller nettbrett for å vise et skjema som dere enkelt kan legge til på dere nettside, ha som standardisde på nettbrett eller telefon på speidermøtet slik at nye kan melde seg inn direkte i gruppa.


Trykk på "Send inn" for å aktivere skjemaet.
Nederst på sida er det mange forskjellige lenker til skjemaet, noe som kan skape litt forvirring, men her er en forklaring:

Uten tilpasset layout
Du kan bruke denne hvis du ikke ønsker å personalisere skjemaet med CSS.

Med tilpasset layout
Bruk denne hvis du har lagt til CSS.

Alternative bredder
Bruk en av disse alternativene hvis du ønsker andre bredder enn standard

Responsive CSS disabled
Bruk denne hvis du ikke ønsker at layout skal være responsiv.

Example
Viser et eksempelskjema hvor flere av ovenstående funksjoner er med.

Hvis du vil "bygge inn" skjemaet på siden din slik at man ikke må klikke på lenken for å komme dit, kan du bruke iframe. HTML-koden blir da
"<iframe src="https://min.speiding.no/register/in/group/xxxx/styles/active"></iframe>" hvor xxxx byttes med gruppenummeret.

3. Hva gjør du når noen har fylt ut skjemaet ditt?

Når skjemaet blir fylt ut og sendt inn får de personene du spesifiserte i "Public registration settings" en e-postvarsel. Da kan en leder gå inn i "Ikke godkjente medlemmer" i medlemsfanen i gruppa.


Her får du en liste over alle som venter på medlemskap.

I den siste kolonnen kan du godkjenne medlemmet, avvise medlemmet eller sette medlemmet på venteliste.

4. CSS og styling

4.1. Hva er CSS?

CSS er språket man skriver når man designer nettsider. I skjemaet kan du skrive din egen CSS, og/eller ta inspirasjon fra en av våre eksempler.

4.2. Eksempler på CSS

4.2.1. speiding.no-stil


* {
   font-family: 'Lato', sans-serif !important;
   box-sizing: border-box;
}

label, h2 {
   color: white !important;
   display: block;
}

html {
   background: none;
}

body {
   background: #33778f !important;
   background-image: url(https://speiding.no/assets/images/footer.png) !important;
   font-size: 0.9em !important;
}

body.frameless {
   margin: 0 !important;
}

div.frameless_wrapper {
   margin: 0 !important;
   max-width: 100vw;
}

#header_bar.slim_header .header_logo {
   width: 200px !important;
   height: auto !important;
   transform: translateY(17px);
}

#header_bar, #header_bar.slim_header {
   border-radius: 0 !important;
}

.slim_header #header_user_details p.logout_link {
   border: none;
}

#main_content {
   padding: 10px !important;
}

.tab_menu.inset {
   margin: 0;
   padding: 20px 10px;
   border-radius: 7px 7px 0 0;
}

.tab_pane.flat {
   padding: 10px;
   overflow-x: auto;
}

h1 {
   font-size: 2em !important;
   line-height: 100%;
   color: white !important;

}

h1>a:link, h1>a:visited, h1>a:active, h1>a:hover {
   color: #ddd;
}

h1:first-line {
   color: currentcolor !important;
}

.inline_add_box {
   height: auto !important;
}

.mini_main_menu_wrapper {
   display: none;
}

input[type=submit],  input[type=submit]:hover{
   border: 1px solid #66a457 !important;
   border-radius: 200px !important;
   display: inline-block !important;
   padding: 12px 30px !important;
   background: none !important;
   background-color: #66a457 !important;
   color: #fff !important;
   font-size: 17px !important;
   text-decoration: none !important;
   position: absolute;
   left: 50%;
   margin: 20px 0;
   transform: translateX(-50%);
}
body.frameless .button { padding: 12px 30px !important; }

input, select {
   padding: 10px !important;
   border-radius: 7px;
}

.question_list ul.custom_list_form li {
margin: 20px 0;
}

.dob_field {
   max-width: none !important;
   width: 90px !important;
}CSS: Andreas Røste - Fri gjenbruk.

4.2.2. Iframe

Hvis du bruker iframe, kan du style skjemaet slik at det ser mer ut som en del av sida di. Hønefoss speidergruppe har brukt iframes på denne måten.



Skjemaet er stylet på denne måten:



* { font-family: 'Open Sans', sans-serif !important; }

h1 { display: none; }

h2, h3 {
   font-family: 'Roboto Slab', sans-serif !important;
   font-size: 190% !important;
   margin-bottom: 10px;
}

html, body {
   background-color: #fff !important;
   margin: 0;
   padding: 0;
}

div.frameless_wrapper { max-width: none; }

.question_list, .register_integrated_form_container {
   background-color: white;
}

.question_list .question_section {
   border: none;
   border-radius: 0;
   padding: 0;
   margin-right: 0;
   margin-left: -7px;
}

.question_list ul.custom_list_form { margin-left: 0; }

.button-green, input[type=submit].button-green, a.button-green, a.button-green:link, .button-green:active, input[type=submit].button-green:active {
   background: none;
   background-color: #da4453;
   color: #fff;
   text-shadow: none;
}

.button, a.button:link, .button-silver, input[type=submit].button-silver, button.button-silver, a.button-silver, .button-silver:active, button.button-silver:active, input[type=submit].button-silver:active, a.button-silver:active, .button-green:active, input[type=submit].button-green:active {
   text-shadow: none;
}

.button {
   line-height: normal;
   padding: 10px !important;
   border: none;
   border-left: none;
   border-right: none;
   border-top: none;
   border-bottom: none;
   border-radius: 4px;
   -webkit-border-radius: 4px;
}

input {
   border: none;
}

.button, .button:hover, .button:link, .button:visited {
   line-height: normal;
   padding: 10px !important;
   border: none;
   border-left: none;
   border-right: none;
   border-top: none;
   border-bottom: none;
   border-radius: 4px;
   -webkit-border-radius: 4px;
}

CSS: Andreas Røste. Grafisk profil: PR-teamet til Hønefoss speidergruppe.