diff --git a/.eslintrc.json b/.eslintrc.json
index 8cf105d..ad3c072 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -53,8 +53,6 @@
         "react/no-array-index-key": "off",
         "@typescript-eslint/explicit-function-return-type": "off",
         "@typescript-eslint/explicit-module-boundary-types": "off",
-        "jsx-a11y/alt-text": "off",
-        "jsx-a11y/iframe-has-title": "off",
         "jsx-a11y/label-has-associated-control": "off",
         "jsx-a11y/click-events-have-key-events": "off",
         "jsx-a11y/no-noninteractive-element-interactions": "off",
diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index c243d1d..cee8250 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -108,7 +108,7 @@ deploy:dev:
         - master
     environment:
         name: dev
-        url: dev.sahkoinsinoorikilta.fi
+        url: https://dev.sahkoinsinoorikilta.fi
     variables:
         DOCKER_HOST: $DEV_CI_DOCKER_HOST
         DOCKER_TLS_VERIFY: 1
@@ -130,7 +130,7 @@ deploy:prod:
         - production
     environment:
         name: production
-        url: sahkoinsinoorikilta.fi
+        url: https://sahkoinsinoorikilta.fi
     when: manual
     variables:
         DOCKER_HOST: $CI_DOCKER_HOST
diff --git a/src/api/eventApi.ts b/src/api/eventApi.ts
index 86fdaa4..83cdc55 100644
--- a/src/api/eventApi.ts
+++ b/src/api/eventApi.ts
@@ -8,6 +8,7 @@ export const URL = `${process.env.NEXT_PUBLIC_API_URL}/events/`;
 export interface Options {
   onlyNonPast?: boolean;
   limit?: number;
+  offset?: number;
   auth?: boolean;
 }
 
@@ -26,11 +27,14 @@ class EventApi {
   }
 
   static async getEvents(options: Options = {}): Promise<Event[]> {
-    const { onlyNonPast, limit, auth } = options;
+    const {
+      onlyNonPast, limit, offset, auth,
+    } = options;
     try {
       const params = {
         since: onlyNonPast ? (new Date()).toISOString() : undefined,
         limit,
+        offset,
       };
       const headers = auth ? { Authorization: getAuthHeader() } : null;
       const resp = await axios.get(`${URL}`, {
diff --git a/src/api/feedApi.ts b/src/api/feedApi.ts
index 759462e..2f00aa2 100644
--- a/src/api/feedApi.ts
+++ b/src/api/feedApi.ts
@@ -6,15 +6,23 @@ import { getAuthHeader } from "@utils/auth";
 export const URL = `${process.env.NEXT_PUBLIC_API_URL}/feed/`;
 
 export interface Options {
+  limit?: number;
+  offset?: number;
   auth?: boolean;
 }
 
 class FeedApi {
   static async getFeed(options: Options = {}): Promise<Post[]> {
-    const { auth } = options;
+    const {
+      limit, offset, auth,
+    } = options;
+    const params = {
+      limit,
+      offset,
+    };
     const headers = auth ? { Authorization: getAuthHeader() } : null;
     try {
-      const resp = await axios.get(URL, { headers });
+      const resp = await axios.get(URL, { params, headers });
       return resp.data.results;
     } catch (err) {
       console.error(err);
diff --git a/src/api/jobAdApi.ts b/src/api/jobAdApi.ts
index a26c28d..eb36d25 100644
--- a/src/api/jobAdApi.ts
+++ b/src/api/jobAdApi.ts
@@ -8,16 +8,20 @@ export const URL = `${process.env.NEXT_PUBLIC_API_URL}/jobads/`;
 export interface Options {
   onlyNonPast?: boolean;
   limit?: number;
+  offset?: number;
   auth?: boolean;
 }
 
 class JobAdApi {
   static async getJobAds(options: Options = {}): Promise<JobAd[]> {
-    const { onlyNonPast, limit, auth } = options;
+    const {
+      onlyNonPast, limit, offset, auth,
+    } = options;
     try {
       const params = {
         since: onlyNonPast ? (new Date()).toISOString() : undefined,
         limit,
+        offset,
       };
       const headers = auth ? { Authorization: getAuthHeader() } : null;
       const resp = await axios.get(`${URL}`, {
diff --git a/src/api/signupApi.ts b/src/api/signupApi.ts
index fa57f44..6b36509 100644
--- a/src/api/signupApi.ts
+++ b/src/api/signupApi.ts
@@ -6,10 +6,12 @@ import { getAuthHeader } from "@utils/auth";
 export const URL = `${process.env.NEXT_PUBLIC_API_URL}/signup/`;
 export const FORM_URL = `${process.env.NEXT_PUBLIC_API_URL}/signupForm/`;
 
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface Options {
-  onlyNonPast?: boolean;
-  limit?: number;
-  auth?: boolean;
+  // onlyNonPast?: boolean;
+  // limit?: number;
+  // offset?: number;
+  // auth?: boolean;
 }
 
 class SignupApi {
diff --git a/src/api/tagApi.ts b/src/api/tagApi.ts
index 8ec4f4c..df41d10 100644
--- a/src/api/tagApi.ts
+++ b/src/api/tagApi.ts
@@ -4,10 +4,11 @@ import Tag from "@models/Tag";
 
 export const URL = `${process.env.NEXT_PUBLIC_API_URL}/tags/`;
 
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface Options {
-  onlyNonPast?: boolean;
-  limit?: number;
-  auth?: boolean;
+  // limit?: number;
+  // offset?: number;
+  // auth?: boolean;
 }
 
 class TagApi {
diff --git a/src/components/Card.tsx b/src/components/Card.tsx
index a23c86c..3b2c6ad 100644
--- a/src/components/Card.tsx
+++ b/src/components/Card.tsx
@@ -7,12 +7,15 @@ import breakpoints from "@theme/breakpoints";
 
 interface WrappedCardProps {
   title: string;
-  start_time: string;
+  startTime: string;
   text: string;
   link: string;
-  image?: string;
-  imageAlt?: string;
+  image?: {
+    src: string;
+    alt: string;
+  };
   buttonOnClick?: () => void;
+  buttonText?: string;
 }
 
 const StyledCard = styled.article`
@@ -67,37 +70,21 @@ const StyledCard = styled.article`
 `;
 
 const WrappedCard: React.FC<WrappedCardProps> = ({
-  title, text, link, image, imageAlt, start_time, buttonOnClick, ...props
-}) => {
-  const options: Intl.DateTimeFormatOptions = {
-    day: "numeric",
-    month: "numeric",
-    year: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-  };
-  const datetime = new Date(start_time).toLocaleString("fi-FI", options);
-  const img = image ? (
-    <Image src={image} alt={imageAlt} layout="responsive" width={0} height={0} objectFit="scale-down" />
-  ) : null;
-
-  const button = (
+  title, text, link, image, startTime, buttonOnClick, buttonText, ...props
+}) => (
+  <StyledCard {...props}>
+    {image && (
+    <Image src={image.src} alt={image.alt} layout="responsive" width={0} height={0} objectFit="scale-down" />
+    )}
+    <p>{startTime}</p>
+    <h3>{title}</h3>
+    <p>{text}</p>
     <Link to={link}>
       <button type="button" onClick={buttonOnClick}>
-        Lue lisää&nbsp;›
+        {buttonText}
       </button>
     </Link>
-  );
-
-  return (
-    <StyledCard {...props}>
-      {img}
-      <p>{datetime}</p>
-      <h3>{title}</h3>
-      <p>{text}</p>
-      {button}
-    </StyledCard>
-  );
-};
+  </StyledCard>
+);
 
 export default WrappedCard;
diff --git a/src/components/ChangeLanguageButton.tsx b/src/components/ChangeLanguageButton.tsx
new file mode 100644
index 0000000..4a49483
--- /dev/null
+++ b/src/components/ChangeLanguageButton.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+import styled from "styled-components";
+import { useTranslation } from "../i18n";
+import Icon, { IconType } from "./Icon";
+
+const ChangeLanguageButton: React.FC = (props) => {
+  const { i18n } = useTranslation();
+  const { language, changeLanguage } = i18n;
+  return (
+    <button
+      {...props}
+      type="button"
+      onClick={() => {
+        changeLanguage(language === "fi" ? "en" : "fi");
+      }}
+    >
+      <Icon name={language === "fi" ? IconType.GBFlag : IconType.FinlandFlag} />
+    </button>
+  );
+};
+
+export default styled(ChangeLanguageButton)`
+  font-size: 4rem;
+  background: none;
+  border: none;
+  width: fit-content;
+`;
diff --git a/src/components/DropDownBox.tsx b/src/components/DropDownBox.tsx
index 3a6425a..8af3658 100644
--- a/src/components/DropDownBox.tsx
+++ b/src/components/DropDownBox.tsx
@@ -10,6 +10,7 @@ interface DropDownBoxProps {
 
 const Box = styled.div`
   background-color: ${colors.white};
+  border: 1px solid ${colors.black};
   margin-top: 0.8rem;
   position: absolute;
   left: 0;
diff --git a/src/components/Footer/FooterContent.tsx b/src/components/Footer/FooterContent.tsx
index bce1497..9ed71b4 100644
--- a/src/components/Footer/FooterContent.tsx
+++ b/src/components/Footer/FooterContent.tsx
@@ -93,6 +93,7 @@ const FooterContent: React.FC = () => (
 
     <Map>
       <iframe
+        title="Maarintalo 8 on Google Maps"
         // eslint-disable-next-line max-len
         src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1983.6122518000927!2d24.81667815176689!3d60.187150048900186!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x468df5eb3cb4ecf1%3A0x3480cbfeedcc07b6!2sMaarintie+8%2C+02150+Espoo!5e0!3m2!1sfi!2sfi!4v1542413548247"
         width="100%"
diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx
index 1efc431..8290aea 100644
--- a/src/components/Icon.tsx
+++ b/src/components/Icon.tsx
@@ -69,10 +69,18 @@ const nameToIcon = (name: IconType): JSX.Element | string => {
     );
   }
   if (name === IconType.FinlandFlag) {
-    return "🇫🇮";
+    return (
+      <span role="img">
+        🇫🇮
+      </span>
+    );
   }
   if (name === IconType.GBFlag) {
-    return "🇬🇧";
+    return (
+      <span role="img">
+        🇬🇧
+      </span>
+    );
   }
   return null;
 };
diff --git a/src/components/index.tsx b/src/components/index.tsx
index c9c36fb..3ca5862 100644
--- a/src/components/index.tsx
+++ b/src/components/index.tsx
@@ -10,3 +10,4 @@ export { default as InfoBox } from "./InfoBox";
 export { default as Accordion } from "./Accordion/Accordion";
 export { default as Link } from "./Link";
 export { default as CrossFadeImages } from "./CrossFadeImages";
+export { default as ChangeLanguageButton } from "./ChangeLanguageButton";
diff --git a/src/hooks/useFetchEvents.ts b/src/hooks/useFetchEvents.ts
index 5c32d00..eb8e2db 100644
--- a/src/hooks/useFetchEvents.ts
+++ b/src/hooks/useFetchEvents.ts
@@ -10,7 +10,9 @@ const fetcher = (url: string, config: AxiosRequestConfig) => axios.get(url, conf
 
 const generateFetchParams = (id = "", options: Options = {}) => {
   const url = `${URL}${id}`;
-  const { auth, onlyNonPast, limit } = options;
+  const {
+    auth, onlyNonPast, limit, offset,
+  } = options;
 
   return {
     url,
@@ -18,6 +20,7 @@ const generateFetchParams = (id = "", options: Options = {}) => {
       params: {
         since: onlyNonPast ? (new Date()).toISOString() : undefined,
         limit,
+        offset,
       },
       headers: auth ? { Authorization: getAuthHeader() } : null,
     },
diff --git a/src/hooks/useFetchFeed.ts b/src/hooks/useFetchFeed.ts
index 1124a46..e17d063 100644
--- a/src/hooks/useFetchFeed.ts
+++ b/src/hooks/useFetchFeed.ts
@@ -10,11 +10,15 @@ const feedFetcher = (url: string, config?: AxiosRequestConfig) => axios.get(url,
 
 const generateFetchParams = (id = "", options: Options = {}) => {
   const url = `${URL}${id}`;
-  const { auth } = options;
+  const { auth, limit, offset } = options;
 
   return {
     url,
     config: {
+      params: {
+        limit,
+        offset,
+      },
       headers: auth ? { Authorization: getAuthHeader() } : null,
     },
   };
diff --git a/src/hooks/useFetchJobAds.ts b/src/hooks/useFetchJobAds.ts
index 100363a..6353816 100644
--- a/src/hooks/useFetchJobAds.ts
+++ b/src/hooks/useFetchJobAds.ts
@@ -10,11 +10,18 @@ const jobAdFetcher = (url: string, config?: AxiosRequestConfig) => axios.get(url
 
 const generateFetchParams = (id = "", options: Options = {}) => {
   const url = `${URL}${id}`;
-  const { auth } = options;
+  const {
+    onlyNonPast, limit, offset, auth,
+  } = options;
 
   return {
     url,
     config: {
+      params: {
+        since: onlyNonPast ? (new Date()).toISOString() : undefined,
+        limit,
+        offset,
+      },
       headers: auth ? { Authorization: getAuthHeader() } : null,
     },
   };
diff --git a/src/i18n/index.tsx b/src/i18n/index.tsx
new file mode 100644
index 0000000..184a565
--- /dev/null
+++ b/src/i18n/index.tsx
@@ -0,0 +1,98 @@
+import React, {
+  createContext, useContext, useReducer,
+} from "react";
+import fi from "./locales/fi/common.json";
+import en from "./locales/en/common.json";
+
+type Lang = "fi" | "en";
+const LOCAL_STORAGE_KEY = "locale";
+
+type TranslateFunc = (key: string) => string;
+
+const translateEn: TranslateFunc = (key) => {
+  const res = en[key];
+  if (!res) {
+    console.warn(`Locale 'en' has no key: ${key}!`);
+  }
+  return res || key;
+};
+
+const translateFi: TranslateFunc = (key) => {
+  const res = fi[key];
+  if (!res) {
+    // Silence warnings for Finnish
+    // console.warn(`Locale 'en' has no key: ${key}!`);
+  }
+  return res || key;
+};
+
+interface Store {
+  language: Lang;
+  changeLanguage: React.Dispatch<Lang>,
+}
+
+let initialLanguage: Lang = "fi";
+try {
+  const storedLang = localStorage.getItem(LOCAL_STORAGE_KEY) as Lang;
+  initialLanguage = storedLang;
+} catch (err) {
+  // Just ignore if fails to get value from browser (server etc.)
+}
+
+const initialState: Store = {
+  language: initialLanguage,
+  changeLanguage: null,
+};
+
+const Reducer = (state: Store, action: Lang) => {
+  switch (action) {
+    case "fi":
+      return {
+        ...state,
+        language: action,
+      };
+    case "en":
+      return {
+        ...state,
+        language: action,
+      };
+    default:
+      return state;
+  }
+};
+
+const LocaleContext = createContext(initialState);
+
+const LocaleStore: React.FC = ({ children }) => {
+  const [state, dispatch] = useReducer(Reducer, initialState);
+  const changeLanguage = (action: Lang) => {
+    dispatch(action);
+    try {
+      localStorage.setItem(LOCAL_STORAGE_KEY, action);
+    } catch (err) {
+      // Just ignore if fails to store value in user's browser
+    }
+  };
+  return (
+    <LocaleContext.Provider value={{ ...state, changeLanguage }}>
+      {children}
+    </LocaleContext.Provider>
+  );
+};
+
+export default LocaleStore;
+
+const useTranslation = () => {
+  const { language, changeLanguage } = useContext(LocaleContext);
+  const t = language === "en" ? translateEn : translateFi;
+
+  return {
+    t,
+    i18n: {
+      language,
+      changeLanguage,
+    },
+  };
+};
+
+export { useTranslation };
diff --git a/src/i18n/locales/en/common.json b/src/i18n/locales/en/common.json
new file mode 100644
index 0000000..911b94a
--- /dev/null
+++ b/src/i18n/locales/en/common.json
@@ -0,0 +1,51 @@
+{
+  "Lue lisää": "Read more",
+  "lngButton": "Suomeksi",
+  "Paikka": "Location",
+  "Alkaa": "Starts at",
+  "Päättyy": "Ends at",
+  "Lataa lisää": "Load more",
+  "Tapahtumat": "Events",
+  "Uutiset": "News",
+
+  "Hakemaasi sivua":
+  "Page",
+
+  "ei löydy":
+  "does not exist",
+
+  "Hups, tapahtui virhe": "Oops, an error occured",
+
+  "Lue lisää täältä": "More information here",
+  "Tärkeä tiedote!": "Important notice!",
+
+  "Katso kaikki tapahtumat":
+  "All events",
+
+  "Ilmoittaudu":
+  "Sign-up",
+
+  "Ilmoittautuminen":
+  "Sign-up",
+
+  "Peruuta":
+  "Cancel",
+
+  "Kokonaishinta":
+  "Total price",
+
+  "Ilmoittautuminen ei ole vielä auki!":
+  "Signup is not open yet!",
+
+  "Se aukeaa":
+  "Signup opens at",
+
+  "Ilmoittautumalla hyväksyn":
+  "By signing up I accept the",
+
+  "tietosuojaselosteen":
+  "privacy policy",
+
+  "ja tietojeni tallentamisen.":
+  "and storing of my data."
+}
\ No newline at end of file
diff --git a/src/i18n/locales/fi/common.json b/src/i18n/locales/fi/common.json
new file mode 100644
index 0000000..16b7f32
--- /dev/null
+++ b/src/i18n/locales/fi/common.json
@@ -0,0 +1,3 @@
+{
+  "lngButton": "In English"
+}
\ No newline at end of file
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index f182d7a..039e3d3 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -5,6 +5,7 @@ import Head from "next/head";
 import styled, { createGlobalStyle } from "styled-components";
 import { ToastContainer } from "react-toastify";
 import { colors } from "@theme/colors";
+import LocaleStore from "../i18n";
 
 import "react-mde/lib/styles/css/react-mde-all.css";
 import "react-toastify/dist/ReactToastify.css";
@@ -140,9 +141,11 @@ const Web20App = ({ Component, pageProps }: AppProps) => (
       <meta name="keywords" content="SIK AYY" />
     </Head>
     <GlobalCommonStyles />
-    <AppContainer>
-      <Component {...pageProps} />
-    </AppContainer>
+    <LocaleStore>
+      <AppContainer>
+        <Component {...pageProps} />
+      </AppContainer>
+    </LocaleStore>
     <ToastContainer position="bottom-right" />
   </>
 );
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 23483b9..37bb458 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -15,6 +15,10 @@ const eventOptions = {
   limit: 4,
 };
 
+const feedOptions = {
+  limit: 4,
+};
+
 interface InitialProps {
   initialEvents: Event[];
   initialFeed: Post[];
@@ -22,7 +26,7 @@ interface InitialProps {
 
 const FrontPage: NextPage<InitialProps> = ({ initialEvents, initialFeed }) => {
   const eventResult = useFetchEvents({ initialData: initialEvents, options: eventOptions });
-  const feedResult = useFetchFeed({ initialData: initialFeed });
+  const feedResult = useFetchFeed({ initialData: initialFeed, options: feedOptions });
 
   return (
     <>
@@ -38,7 +42,7 @@ const FrontPage: NextPage<InitialProps> = ({ initialEvents, initialFeed }) => {
 
 export const getStaticProps: GetStaticProps<InitialProps> = async () => {
   const initialEvents = await EventApi.getEvents(eventOptions);
-  const initialFeed = await FeedApi.getFeed();
+  const initialFeed = await FeedApi.getFeed(feedOptions);
   return {
     props: {
       initialEvents,
diff --git a/src/views/ActualPage/ActualPageView.tsx b/src/views/ActualPage/ActualPageView.tsx
index b689c61..ca99f99 100644
--- a/src/views/ActualPage/ActualPageView.tsx
+++ b/src/views/ActualPage/ActualPageView.tsx
@@ -5,7 +5,7 @@ import Event from "@models/Event";
 import Post from "@models/Feed";
 
 import {
-  Divider, CTASection, TextSection, Link, CrossFadeImages,
+  Divider, CTASection, TextSection, Link, CrossFadeImages, ChangeLanguageButton,
 } from "@components/index";
 import ActualPageHero from "./ActualPageHero";
 import EventCalendar from "./EventCalendar";
@@ -32,14 +32,18 @@ const Gallery = styled.div`
   }
 `;
 
+const LngButton = styled(ChangeLanguageButton)`
+  align-self: flex-end;
+  margin-right: 1rem;
+`;
+
 const ActualPageView: React.FC<ActualPageViewProps> = ({ events, feed }) => (
   <>
     <ActualPageHero />
 
+    <LngButton />
     <EventCalendar events={events} />
-
     <Divider />
-
     <News feed={feed} />
 
     <CTASection
diff --git a/src/views/ActualPage/EventCalendar.tsx b/src/views/ActualPage/EventCalendar.tsx
index 8c0b7d7..e3aeced 100644
--- a/src/views/ActualPage/EventCalendar.tsx
+++ b/src/views/ActualPage/EventCalendar.tsx
@@ -1,9 +1,11 @@
 import React, { useState } from "react";
-import Event from "@models/Event";
-import Button from "@components/Button";
 
-import { CardSection, Card, FullWidthSection } from "@components/index";
+import Event from "@models/Event";
+import {
+  Button, CardSection, Card, FullWidthSection,
+} from "@components/index";
 import noop from "@utils/noop";
+import { useTranslation } from "../../i18n";
 import FilterContainer from "./FilterContainer";
 
 interface EventCalendarProps {
@@ -13,11 +15,32 @@ interface EventCalendarProps {
 const EventCalendar: React.FC<EventCalendarProps> = ({ events }) => {
   // const [filterSelected, setFilter] = useState(0);
   const [numberShown, setNumberShown] = useState(8);
-  const filteredEvents = events.slice(0, numberShown);
+
+  const { t, i18n } = useTranslation();
+  const isFi = i18n.language === "fi";
+
+  const options: Intl.DateTimeFormatOptions = {
+    day: "numeric",
+    month: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+  };
+
+  const filteredEvents = events.slice(0, numberShown).map((e) => ({
+    ...e,
+    title: isFi ? e.title_fi : e.title_en,
+    description: isFi ? e.description_fi : e.description_en,
+    content: isFi ? e.content_fi : e.content_en,
+    location: isFi ? e.location_fi : e.location_en,
+    startDate: new Date(e.start_time).toLocaleString(isFi ? "fi-FI" : "en-GB", options),
+    endDate: new Date(e.end_time).toLocaleString(isFi ? "fi-FI" : "en-GB", options),
+  }));
+
   return (
     <FullWidthSection>
       <h1 id="tapahtumat">
-        Tapahtumat
+        {t("Tapahtumat")}
         {/* <FilterContainer>
           <Button buttonStyle="filter" onClick={() => { setFilter(0); }} selected={filterSelected === 0}>
             Näytä kaikki
@@ -35,18 +58,19 @@ const EventCalendar: React.FC<EventCalendarProps> = ({ events }) => {
         {filteredEvents.map((e) => (
           <Card
             key={e.id}
-            title={e.title_fi}
-            start_time={e.start_time}
-            text={e.description_fi}
+            title={e.title}
+            startTime={e.startDate}
+            text={e.description}
             link={`/events/${e.id}`}
             buttonOnClick={noop}
+            buttonText={`${t("Lue lisää")} ›`}
           />
         ))}
       </CardSection>
       { numberShown < events.length && (
         <FilterContainer>
           <Button buttonStyle="bordered" onClick={() => { setNumberShown(numberShown + 8); }}>
-            Lataa lisää
+            {t("Lataa lisää")}
           </Button>
         </FilterContainer>
       )}
diff --git a/src/views/ActualPage/News.tsx b/src/views/ActualPage/News.tsx
index ea7f6f6..f4388aa 100644
--- a/src/views/ActualPage/News.tsx
+++ b/src/views/ActualPage/News.tsx
@@ -1,9 +1,11 @@
 import React, { useState } from "react";
 import Post from "@models/Feed";
-import Button from "@components/Button";
 
-import { CardSection, Card, FullWidthSection } from "@components/index";
+import {
+  Button, CardSection, Card, FullWidthSection,
+} from "@components/index";
 import noop from "@utils/noop";
+import { useTranslation } from "../../i18n";
 import FilterContainer from "./FilterContainer";
 
 interface NewsProps {
@@ -13,11 +15,29 @@ interface NewsProps {
 const News: React.FC<NewsProps> = ({ feed }) => {
   // const [filterSelected, setFilter] = useState(0);
   const [numberShown, setNumberShown] = useState(8);
-  const filteredFeed = feed.slice(0, numberShown);
+
+  const { i18n, t } = useTranslation();
+  const isFi = i18n.language === "fi";
+
+  const options: Intl.DateTimeFormatOptions = {
+    day: "numeric",
+    month: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+  };
+
+  const filteredFeed = feed.slice(0, numberShown).map((p) => ({
+    ...p,
+    title: isFi ? p.title_fi : p.title_en,
+    description: isFi ? p.description_fi : p.description_en,
+    content: isFi ? p.content_fi : p.content_en,
+    publishTime: new Date(p.publish_time).toLocaleString(isFi ? "fi-FI" : "en-GB", options),
+  }));
   return (
     <FullWidthSection>
       <h1 id="uutiset">
-        Uutiset
+        {t("Uutiset")}
         {/* <FilterContainer>
           <Button buttonStyle="filter" onClick={() => { setFilter(0); }} selected={filterSelected === 0}>
             Näytä kaikki
@@ -34,18 +54,19 @@ const News: React.FC<NewsProps> = ({ feed }) => {
         {filteredFeed.map((post) => (
           <Card
             key={post.id}
-            title={post.title_fi}
-            start_time={post.publish_time}
-            text={post.description_fi}
+            title={post.title}
+            startTime={post.publishTime}
+            text={post.description}
             link={`/feed/${post.id}`}
             buttonOnClick={noop}
+            buttonText={`${t("Lue lisää")} ›`}
           />
         ))}
       </CardSection>
       { numberShown < feed.length && (
         <FilterContainer>
           <Button buttonStyle="bordered" onClick={() => { setNumberShown(numberShown + 8); }}>
-            Lataa lisää
+            {t("Lataa lisää")}
           </Button>
         </FilterContainer>
       )}
diff --git a/src/views/EventPage/EventPageView.tsx b/src/views/EventPage/EventPageView.tsx
index 29ebba9..0e502ec 100644
--- a/src/views/EventPage/EventPageView.tsx
+++ b/src/views/EventPage/EventPageView.tsx
@@ -3,12 +3,13 @@ import Image from "next/image";
 import styled from "styled-components";
 import colors from "@theme/colors";
 import Event from "@models/Event";
-import Button from "@components/Button";
-import { Link, TextSection } from "@components/index";
+import {
+  Button, Link, TextSection, ChangeLanguageButton,
+} from "@components/index";
 import noop from "@utils/noop";
-
 import MarkdownStyles from "@views/common/MarkdownStyles";
 import LoadingView from "@views/common/LoadingView";
+import { useTranslation } from "../../i18n";
 
 interface EventPageViewProps {
   event?: Event;
@@ -33,7 +34,6 @@ const StyledTextSection = styled(TextSection)`
       line-height: 0.4rem;
     }
   }
-
 `;
 
 const SignupButtons = styled.div`
@@ -46,49 +46,68 @@ const Content = styled(MarkdownStyles)`
   margin-top: 1.5rem;
 `;
 
+const LngButton = styled(ChangeLanguageButton)`
+  align-self: flex-end;
+  margin-right: 1rem;
+`;
+
 const EventPageView: React.FC<EventPageViewProps> = ({ event }) => {
+  const { i18n, t } = useTranslation();
   if (!event) return <LoadingView />;
-  const date_start = new Date(event.start_time).toLocaleString("fi-FI");
-  const date_end = new Date(event.end_time).toLocaleString("fi-FI");
+  const isFi = i18n.language === "fi";
+  const {
+    title, description, content, location, startDate, endDate,
+  } = {
+    title: isFi ? event.title_fi : event.title_en,
+    description: isFi ? event.description_fi : event.description_en,
+    content: isFi ? event.content_fi : event.content_en,
+    location: isFi ? event.location_fi : event.location_en,
+    startDate: new Date(event.start_time).toLocaleString(isFi ? "fi-FI" : "en-GB"),
+    endDate: new Date(event.end_time).toLocaleString(isFi ? "fi-FI" : "en-GB"),
+  };
+
   return (
-    <StyledTextSection>
-      <h1>
-        {event.title_fi}
-        <p>
-          {event.description_fi}
-        </p>
-        <Image
-          src={event.image || event.tags[0].icon}
-          alt={event.title_fi}
-          objectFit="scale-down"
-          layout="responsive"
-          width={16}
-          height={9}
-        />
-      </h1>
-      <div>
-        <Content source={event.content_fi} escapeHtml={false} />
-        <p>
-          Paikka: {event.location_fi}
-        </p>
-        <p>
-          <time>Alkaa: {date_start}</time>
-        </p>
-        <p>
-          <time>Päättyy: {date_end}</time>
-        </p>
-        {/* We may have multiple signup forms. Generate own Button for each one */}
-        <SignupButtons>
-          {event.signupForm.map((sf) => (
-            <Link key={sf.id} to={`/signup/${sf.id}`}>
-              <Button buttonStyle="filled" onClick={noop}>
-                {sf.title_fi}
-              </Button>
-            </Link>
-          ))}
-        </SignupButtons>
-      </div>
-    </StyledTextSection>
+    <>
+      <LngButton />
+      <StyledTextSection>
+        <h1>
+          {title}
+          <p>
+            {description}
+          </p>
+          <Image
+            src={event.image || event.tags[0].icon}
+            alt={title}
+            objectFit="scale-down"
+            layout="responsive"
+            width={16}
+            height={9}
+          />
+        </h1>
+        <div>
+          <Content source={content} escapeHtml={false} />
+          <p>
+            {`${t("Paikka")}: ${location}`}
+          </p>
+          <p>
+            <time>{`${t("Alkaa")}: ${startDate}`}</time>
+          </p>
+          <p>
+            <time>{`${t("Päättyy")}: ${endDate}`}</time>
+          </p>
+          {/* We may have multiple signup forms. Generate own Button for each one */}
+          <SignupButtons>
+            {event.signupForm.map((sf) => (
+              <Link key={sf.id} to={`/signup/${sf.id}`}>
+                <Button data-e2e="signup-button" buttonStyle="filled" onClick={noop}>
+                  {isFi ? sf.title_fi : sf.title_en}
+                </Button>
+              </Link>
+            ))}
+          </SignupButtons>
+        </div>
+      </StyledTextSection>
+    </>
   );
 };
 export default EventPageView;
diff --git a/src/views/FeedPage/FeedPageView.tsx b/src/views/FeedPage/FeedPageView.tsx
index b6805e6..925b9c0 100644
--- a/src/views/FeedPage/FeedPageView.tsx
+++ b/src/views/FeedPage/FeedPageView.tsx
@@ -3,9 +3,10 @@ import Image from "next/image";
 import styled from "styled-components";
 import colors from "@theme/colors";
 import Post from "@models/Feed";
-import { TextSection } from "@components/index";
+import { TextSection, ChangeLanguageButton } from "@components/index";
 import MarkdownStyles from "@views/common/MarkdownStyles";
 import LoadingView from "@views/common/LoadingView";
+import { useTranslation } from "../../i18n";
 
 interface FeedPageViewProps {
   post?: Post;
@@ -30,30 +31,49 @@ const Content = styled(MarkdownStyles)`
   margin-top: 1.5rem;
 `;
 
+const LngButton = styled(ChangeLanguageButton)`
+  align-self: flex-end;
+  margin-right: 1rem;
+`;
+
 const FeedPageView: React.FC<FeedPageViewProps> = ({ post }) => {
+  const { i18n } = useTranslation();
   if (!post) return <LoadingView />;
+  const { language } = i18n;
+  const isFi = language === "fi";
+  const {
+    title, description, content,
+  } = {
+    title: isFi ? post.title_fi : post.title_en,
+    description: isFi ? post.description_fi : post.description_en,
+    content: isFi ? post.content_fi : post.content_en,
+  };
+
   return (
-    <StyledTextSection>
-      <h1>
-        {post.title_fi}
-        <p>
-          {post.description_fi}
-        </p>
-        {post.image && (
+    <>
+      <LngButton />
+      <StyledTextSection>
+        <h1>
+          {title}
+          <p>
+            {description}
+          </p>
+          {post.image && (
           <Image
             src={post.image}
-            alt={post.title_fi}
+            alt={title}
             objectFit="scale-down"
             layout="responsive"
             width={16}
             height={9}
           />
-        )}
-      </h1>
-      <div>
-        <Content source={post.content_fi} escapeHtml={false} />
-      </div>
-    </StyledTextSection>
+          )}
+        </h1>
+        <div>
+          <Content source={content} escapeHtml={false} />
+        </div>
+      </StyledTextSection>
+    </>
   );
 };
 export default FeedPageView;
diff --git a/src/views/FrontPage/FrontPageView.tsx b/src/views/FrontPage/FrontPageView.tsx
index 87444f8..f3a893b 100644
--- a/src/views/FrontPage/FrontPageView.tsx
+++ b/src/views/FrontPage/FrontPageView.tsx
@@ -32,6 +32,14 @@ interface FrontPageViewProps {
   feed: Post[];
 }
 
+const cardTimeOpts: Intl.DateTimeFormatOptions = {
+  day: "numeric",
+  month: "numeric",
+  year: "numeric",
+  hour: "numeric",
+  minute: "2-digit",
+};
+
 const SponsorReel = styled.div`
   text-align: center;
   & > div {
@@ -72,11 +80,15 @@ const FrontPageView: React.FC<FrontPageViewProps> = ({ events, feed }) => (
           <Card
             key={event.id}
             title={event.title_fi}
-            start_time={event.start_time}
+            startTime={new Date(event.start_time).toLocaleString("fi-FI", cardTimeOpts)}
             text={event.description_fi}
             link={`/events/${event.id}`}
-            image={event.image || event.tags[0].icon}
+            image={{
+              src: event.image || event.tags[0].icon,
+              alt: event.title_fi,
+            }}
             buttonOnClick={noop}
+            buttonText="Lue lisää&nbsp;›"
             data-e2e="event-card"
           />
         ))}
@@ -101,10 +113,11 @@ const FrontPageView: React.FC<FrontPageViewProps> = ({ events, feed }) => (
           <Card
             key={inst.id}
             title={inst.title_fi}
-            start_time={inst.publish_time}
+            startTime={new Date(inst.publish_time).toLocaleString("fi-FI", cardTimeOpts)}
             text={inst.description_fi}
             link={`/feed/${inst.id}`}
             buttonOnClick={noop}
+            buttonText="Lue lisää&nbsp;›"
           />
         ))}
         <aside>
diff --git a/src/views/InEnglishPage/InEnglishPageView.tsx b/src/views/InEnglishPage/InEnglishPageView.tsx
index 3fc4d5f..dcf7950 100644
--- a/src/views/InEnglishPage/InEnglishPageView.tsx
+++ b/src/views/InEnglishPage/InEnglishPageView.tsx
@@ -37,6 +37,14 @@ interface InEnglishPageViewProps {
   feed: Post[];
 }
 
+const cardTimeOpts: Intl.DateTimeFormatOptions = {
+  day: "numeric",
+  month: "numeric",
+  year: "numeric",
+  hour: "numeric",
+  minute: "2-digit",
+};
+
 const InEnglishPageView: React.FC<InEnglishPageViewProps> = ({ events, feed }) => (
   <>
     <InEnglishPageHero />
@@ -120,9 +128,9 @@ const InEnglishPageView: React.FC<InEnglishPageViewProps> = ({ events, feed }) =
           <p>Balance your studies and get connected</p>
           <div>
             <h6>Build everything related to electronics</h6>
-            <p>Elepaja is an electronics workshop run by the guild, where students get to apply skills they have learned at school in practical projects. Over time, students have built diverse projects in the workshop, such as their first LED flashlights, tesla windings, robots and radio transmitters. If you are interested in building electronics or you need help with a project, then come visit the workshop located at Otakaari 1 h023b. The workshop is equipped with basic tools such as circuit boards, etching tools, soldering tools, various components, column drill and a wide range of measuring equipment. You can join elepaja&apos;s Telegram group <Link to="https://elepaja.fi/tg">here</Link></p>
+            <p>Elepaja is an electronics workshop run by the guild, where students get to apply skills they have learned at school in practical projects. Over time, students have built diverse projects in the workshop, such as their first LED flashlights, tesla windings, robots and radio transmitters. If you are interested in building electronics or you need help with a project, then come visit the workshop located at Otakaari 1 h023b. The workshop is equipped with basic tools such as circuit boards, etching tools, soldering tools, various components, column drill and a wide range of measuring equipment. You can join <Link to="https://elepaja.fi/tg">elepaja&apos;s Telegram group here</Link>.</p>
             <h6>Sports events</h6>
-            <p>The committee of Well Being runs many things in our guild. One of these is providing sports events to the guild members. In cooperation with other guilds, we regularly organize opportunities to play floorball and other sports. Sports tryouts are available throughout the year and are organized in co-operation with various sports organizations in Otaniemi. Keep your eyes open in the <Link to="#events">events</Link> section and join the <Link to="https://t.me/joinchDJRXxkKd0SMj0e9pBPXF1Aat/"> sports Telegram group.</Link></p>
+            <p>The committee of Well Being runs many things in our guild. One of these is providing sports events to the guild members. In cooperation with other guilds, we regularly organize opportunities to play floorball and other sports. Sports tryouts are available throughout the year and are organized in co-operation with various sports organizations in Otaniemi. Keep your eyes open in the <Link to="#events">events</Link> section and join the <Link to="https://t.me/joinchat/DJRXxkKd0SMj0e9pBPXF1A/"> sports Telegram group.</Link></p>
             <h6>Culture from culinarism to theater</h6>
             <p>In addition to sports events, the committee of Well Being also organizes cultural events for guild members. These cultural events include various types of events such as theater and museum visits. You can see the upcoming cutrural events from the <Link to="#events">events</Link> section.</p>
             <h6>Cooperation with companies</h6>
@@ -198,11 +206,15 @@ const InEnglishPageView: React.FC<InEnglishPageViewProps> = ({ events, feed }) =
           <Card
             key={event.id}
             title={event.title_en}
-            start_time={event.start_time}
+            startTime={new Date(event.start_time).toLocaleString("en-GB", cardTimeOpts)}
             text={event.description_en}
             link={`/events/${event.id}`}
-            image={event.image || event.tags[0].icon}
+            image={{
+              src: event.image || event.tags[0].icon,
+              alt: event.title_en,
+            }}
             buttonOnClick={noop}
+            buttonText="Read more&nbsp;›"
             data-e2e="event-card"
           />
         ))}
@@ -224,10 +236,11 @@ const InEnglishPageView: React.FC<InEnglishPageViewProps> = ({ events, feed }) =
           <Card
             key={inst.id}
             title={inst.title_en}
-            start_time={inst.publish_time}
+            startTime={new Date(inst.publish_time).toLocaleString("en-GB", cardTimeOpts)}
             text={inst.description_en}
             link={`/feed/${inst.id}`}
             buttonOnClick={noop}
+            buttonText="Read more&nbsp;›"
           />
         ))}
         <aside>
diff --git a/tests/testcafe/signupToEvent.test.ts b/tests/testcafe/signupToEvent.test.ts
index 78615a8..0099b90 100644
--- a/tests/testcafe/signupToEvent.test.ts
+++ b/tests/testcafe/signupToEvent.test.ts
@@ -32,7 +32,7 @@ test("User signups to event from front page", async (t) => {
   await t.wait(3000);
   await t.expect(await getPageUrl()).match(/\/events\/\d{1,4}/, "URL isn't /events/<id>");
 
-  const SignupButton = Selector("button");
+  const SignupButton = Selector("[data-e2e=\"signup-button\"]");
   await t
     .click(SignupButton);