►
Description
In this video we'll demonstrate the steps to take advantage of Microsoft Teams personal apps and how we can expose modern SharePoint corporate communication portal welcome page or other relevant content in Microsoft Teams as a no-code solution - only with configurations in the user interface.
Video also covers how to pin the portal to the Microsoft Teams left menu selection by default for the company employees. This is a great solution to combine best of both worlds by having corporate communications portal exposed for employees in their collaboration platform.
Demonstrated solution works in Microsoft Teams in all different clients - web, desktop and mobile.
Notice that this capability is provided as a preview integration path - and we will be improving this feature and integration further in future.
Resources on the covered topics:
- Documentation and tutorial on embedding SharePoint pages in Microsoft Teams as a personal app - https://docs.microsoft.com/en-us/sharepoint/dev/features/embed-pages-to-teams
- Microsoft Look Book - https://lookbook.microsoft.com
- Manage app setup policies in Microsoft Teams - https://docs.microsoft.com/en-us/microsoftteams/teams-app-setup-policies
Video has been recorded in June 2020. We will keep on evolving this guidance as new native capabilities are released.
A
Hello
in
this
video
we'll
have
a
look
on
how
you
can
expose
any
sharepoint
modern
page
in
a
mix
of
themes
as
a
personal
application
and
what
it
means.
Instance,
you
can
expose
a
modern
sharepoint
pages
in
the
left,
navigation
bar
and
you
can
even
control
to
which
users
in
your
organization
this
these
applications
to
personal
applications
will
be
there
by
default,
so
you
can
actually
control
and
these
visibility's
or
the
application
visibility
in
the
left
navigation.
A
The
typical
scenario
would
be
something
like
you
want
to
expose
your
corporate
communication
or
intranets
and
landing
page
on
the
left
navigation
of
Microsoft
themes,
so
you
can
actually
take
advantage
the
best
of
the
both
world.
So
you
have
the
collaboration
tooling
in
the
Microsoft
team,
mr.
chatting,
the
call
calling
and
all
of
that
stuff
the
video
channels
and
and
other
functionalities,
but
then
you
have
to
cooperate,
communicational
news
and
articles
and
guidance
embedded
directly
in
the
Microsoft
teams.
So
it
is
a
quite
typical
scenario.
A
Now
we
are
recording
this
video
and
this
version
of
the
video
in
attitude
2020,
and
this
is
an
area
where
we
are
adding
additional
capabilities
and-
and
we
are
investing
from
an
engineering
perspective.
So
this
is
for
one.
It
is
a
preview
integration
path
between
the
SharePoint,
Online
and
Microsoft
themes.
We,
it
will
get
better
and
right
now
there
are
certain
limitations
which
will
have
a
briefly
look
on
the
on
the
video
as
well.
A
Now,
what
would
be
then
and
the
scenario
so,
as
we
mentioned
already
that
you
when
I,
expose
the
corporate
communication
portal,
for
example
in
the
Microsoft
themes?
That
would
be
one
of
the
scenario
you
might
want
to
expose,
for
example,
the
learning
pathways,
our
guidance
and
learning
paths
for
people
to
use
Microsoft
register
5
directly
in
the
Microsoft
themes.
That
would
be
one
really
good
example
scenario
or
you
might
have
any
other
important,
SharePoint
modern
pages,
which
you
want
to
actually
expose
for
your
employees
in
the
left
navigation.
A
So
using
this
tutorial
and
these
steps
in
here,
you
can
easily
make
that
happen
and
it
will
work
in
both
web
client
and
in
a
distal
plant
and
well
actually
also
in
mobile
client.
So
we
have
an
intense
inari
Oh
in
our
hands
or
into
any
scenario
which
we
can
actually
use
now,
let's
actually
get
moving
and
let's
see
how
we
make
this
happen
in
practice.
So,
first
of
all,
in
my
environment
we
are
using
the
Microsoft
themes.
A
This
is
a
relatively
small
amount
of
example,
channels
and
example,
teams
available
in
here,
and
we
kind
of
exposed
the
portal,
in
my
case,
in
the
left
navigation
pane.
So
you
can
actually
even
control
who
to
which
application
will
be
available
in
the
left,
navigation,
pane
and
we'll
come
back
on
that
one
slightly
later
on
the
videos.
So
in
my
case,
I'm
going
to
use
and
the
perspective
example,
which
is
one
of
our
corporate
communication.
A
We
can
actually
merge
these
together
and
that's
really
the
key
and
objective
of
this
tutorial.
So,
first
of
all,
let's
start
by
installing
apps
to
do
in
the
Microsoft
themes.
So
let's
go
to
the
the
tree-tops
in
here
or
we
can
go
well,
let's
actually
go
from
there
to
the
more
apps
and
then
I
want
to
install
have
studio,
which
is
the
one
which
we
use
to
create
the
needed
definition,
and
this
is
actually
no
code
option.
A
So
you
might
actually
even
debate
that
this
at
the
developer
tool,
because
we're
not
gonna,
actually
write
any
code,
so
we're
just
adding
configurations
to
expose
the
any
SharePoint
page
inside
of
the
Microsoft
themes
in
this
case.
So,
let's
add
under
app
studio
in
we're,
adding
to
our
studio.
For
me
as
I
si
user
as
a
personal
application,
and
in
here
we
then
go
to
the
manifest
editor
and
that's
where
we
actually
start
creating
the
content
and
creating
the
structures
so
we're
gonna
create
a
new
application.
A
I
create
a
new
app
and
based
on
our
guidance,
I'm
gonna,
actually
just
copy
the
values
which
were
providing.
So,
let's
give
it
a
name.
Let's
give
it
a
full
name
like
company
intranet.
Whatever
is
your
preference
whatever
you
want
to
call
it
out,
and
we
want
to
generate
the
unique
ID
for
the
application.
Let's
give
also
in
a
package
name
and
let's
use
version
of
1.00,
we
can
set
the
description
as
what
we
want,
but
I'm
going
to
use
two
values
which
we
suggest
in
our
written
tutorial
as
well.
A
So
let's
actually
copy
those
values
of
my
first
internet
application.
My
awesome
internet
application,
then
the
modern
SharePoint
in
themes.
Now
on
the
developer
information
we
can.
We
can
call
here
contoso
and
let's
say
the
web
site
is
also
WWE
controller
that
come
it
doesn't
really
matter.
You
can
actually
pinpoint
to
any
location
I'm
going
to
just
use
example,
data,
and
here
the
developer
information
is
not
that
widely
visible
it's
exposed.
A
Now
for
the
privacy
and
again
we
need
to
have
some
sort
of
a
privacy
entries,
so
let's
actually
call
and
set
that
as
privacy
and
turn
the
URL
for
terms
of
usage
and
not
really
super
important
again
in
this
case,
because
we
are
using
an
or
creating
an
application
internally
in
our
company.
So
it's
not
like
we're
pushing
an
application
in
the
app
source,
but,
let's
add
some
values
there.
A
They
are
mandatory
entries
as
well
now,
in
my
case,
I'm
not
going
to
set
any
branding
values
in
here,
but
obviously,
in
your
case
and
the
officials
setup,
you
would
like
to
definitely
do
that
you
can
have
a
full-color
logo
of
your
company
and
then
a
transparent
outline
updated
here.
Accordingly,
the
transparent
outline
would
be
aligning,
for
example,
that
transparent
outline
logo
there,
which
is
tab,
Studio
One.
So
you
would
have
the
invisibility
on
oh
the
company
logo
on
the
Left
navigation.
A
You
know
that
you
can
access
the
corporate
communication
on
slide
when
it
will
make
that
logo.
But
again,
in
our
case,
we
kind
of
leave
it
empty
for
now.
Now
that's
the
basic
setup
and
that's
good,
and
then
we
want
to
go
to
the
tab
section
and
we're
going
to
create
a
personal
tab.
So
it
is
actually
behaving
like
that
studio.
So
it
actually
is
not
installed
inside
of
a
team.
It
is
accessed
through
the
left
navigation.
So
let's
actually
do
it
on
so
I'm
going
to
click
Add.
A
Then
let's
keep
the
tab
yeah
a
name.
So
let's
give
it
a
name
called
intranet.
Let's
give
it
a
unique
ID,
it
doesn't
really
matter
as
long
as
it's
unique
inside
of
the
solution
and
since
we
only
have
a
one
tab
in
this
case,
it's
not
actually
that
a
difficult
thing
to
do
now.
This
is
the
critical
part.
Now,
if
you
would
only
take
the
URL
the
website,
URL
and
pinpointed
that
one
and
this
solution
would
only
work
in
the
web
client.
A
So
that
means
that
it
wouldn't
work
if
people
are
using
the
desktop
client-
and
we
want
this
to
work
with
their
sub
client.
So
we
need
to
do
some
adjustments
related
on
the
content
URL.
And
how
do
we
do
that?
Well,
in
my
case,
I'm,
going
to
use
simply
note
that
and
I've
actually
have
already
URL
here
available
so
because
we
want
to
expose
the
respective
URL
of
the
perspective
portal
from
this
URL
and
actual
page
which
we
actually
have
there.
Let
me
go
there
as
well.
Getting
served
is
in
the
site
latest
at-home
aspx.
A
A
So
it
doesn't
actually
cause
any
challenges,
and
that's
that's
basically
why
we
need
that,
this
additional,
let's
say,
transition
or
a
jump.
Basically,
what
happens
behind
the
scenes
is
that
we
will
access
this
limp
teams,
logging,
and
then
we
will
be
redirected
to
this
URL
as
the
end
so
and
access
from
an
end
user
perspective.
You
don't
actually
see
the
transition,
so
it's
all
good.
So
what
I'm
doing
now
is
that
I'm
copying
that
entry,
let's
go
back
in
my
app
studio,
let's
add
to
continue
RL
and
base
that
one
in
for
the
website
URL.
A
We
can
actually
leave
it
completely
empty
and,
let's
click
Save
and
that's
the
whole
configuration
needed
and
to
make
the
bear
personal
application
or
personal
tab
to
be
available
in
this
solution.
Now
before
we
can
test
it.
We
need
to
configure
this
slightly,
so
we
need
to
add
some
settings
in
the
domains
and
permissions.
First
of
all,
we
need
to
make
sure
that
the
domains
from
your
tabs
includes
the
right
to
main,
so
this
is
there
by
default.
A
So
it
should
work
okay
for
you
as
well,
but
we
would
also
need
to
have
a
aad
app
ID,
updated
based
on
our
guidance
and
the
documentation,
so
we're
adding
here
it
is
zero,
zero,
zero,
three
unique
gooood,
which
is
actually
the
unique
with
SharePoint
Online.
Technically,
if
you're,
not
a
technical
person,
you
don't
need
actually
vary
about
it.
A
It
just
needs
to
be
there
to
make
sure
that
the
single
sign-on
transitions
are
working
properly
and
then
we
need
to
update
the
single
sign-on
entry
in
here
and
I
need
to
update
CDP
and
the
full
URL
with
an
HTTP
prefix
of
the
tenant
which
we
are
not
actually
using.
So
in
my
case
again,
the
perspective
is
that
entries
is
2,
5,
x,
0,
0,
7
and
so
on,
and
we
can
add
that
one
there
with
a
SharePoint
common,
you
are
L
completing
that
now,
then
we
are
actually
ready
to
test
and
distribute
the
setting.
A
So
let
me
go
to
the
test
and
distribute
and
we
can
actually
click
potentially
the
install
option
in
here
or
we
can
download
and
save
the
package
or
upload
the
packets
directly
to
the
app
catalog.
Now,
if
I
click
the
install
in
my
case,
we
can
see
that
the
the
company
settings
have
not
yet
allowed
to
do
site
loading,
and
this
means
that
it
I
cannot
actually
do
testing
within
my
tenants-
and
this
probably
is
the
typical
setting,
but
you
can
see
in
your
case
as
well,
you
can
actually
control
the
setting.
A
If
you
go
to
the
themes,
application
and
set
up
policies
and
in
the
set
of
policies,
if
we
open
up
the
compare
or
nationwide
policies
that
we
can
actually
see
what
is
the
setting
of
upload
custom
apps,
so
in
my
case
I
just
pretty
reason,
they
said
that
to
be
yes
and
it
takes
up
file
to
refresh
the
settings
and
that's
why
you
actually
see
the
exception
in
the
or
in
the
in
the
apps
to
do.
But
that's
fine.
If
you
see
that
well,
that's,
okay!
A
We
can
actually
download
the
package
in
our
den
their
test
environment.
So,
let's
allow
that
download
to
happen.
We
can
actually
see
our
component
internet
the
zip
file
over
there
and
then,
if
we
open
up
that
one
in
a
folder.
Well,
it's
obviously
in
my
downloads,
folder
or
such
and
now
we
can
actually
install
this
to
our
test
environment
by
uploading,
a
custom
application
and
obviously
you
need
to
be.
You
need
to
have
the
sufficient
permission
to
do
this
so
that
you
can
actually
access
and
add
this
application
to
your
company
after
work
as
well.
A
So
I'm
selecting
upload
for
composer
and
I'm
going
to
go
to
the
downloads
I'm
going
to
select
my
zip
file
and
that's
getting
updated
to
be
available
for
cantos
or
employees.
So,
in
my
case,
I
didn't
modify
the
image
and
that's
why
we're
saying
that
program
in
picture
and
we
can
actually
see
well
to
be
the
default
picture
in
here.
We
can
also
see
the
example.
Title
example,
description
and
all
of
the
settings
which
we
provided
as
part
of
the
creation
of
the
solution.
A
Definition
in
the
app
studio
now
clicking
them
at
will
app
that
one
as
a
personal
application
to
the
left
panel
and
voila.
We
can
actually
see
the
portal
being
exposed
in
here,
but
there
are
certain
things
again
to
call
out
in
the
indie
experience.
No,
we
can't
first
of
all
see
if
we
go
side
by
side
with
and
the
SharePoint
one
and
one
which
is
being
exposed
and
ship
within
the
teams.
We
can
actually
see
all
of
the
news.
A
We
can
see
the
information
and
all
that
stuff
and
you
can
actually
go
inside
of
the
articles.
You
can
access
the
information
between
the
what
has
been
published
now.
It's
quite
important,
though,
to
notice
that
we
are
missing
the
navigation
and
we're
missing
certain
other
settings
like
the
footer
and
so
on.
So
this
is
right
now
by
design
and
there's
no
way
for
actually
adjusting
that
we
aren't
working
on
making
this
experience
better
and
an
additional
options
to
be
available
for
you
to
choose
from,
and
that's
why
this
is
provided
as
a
preview.
A
Integration
path
has
mentioned
too,
when
we
started
configuring.
This
experience
in
the
Vice
of
themes.
There
will
be
like
that
there
will
be
improved
experiences
on
this
one
later.
Absolutely
but
again
it
gives
you
the
access
on
the
news
and
articles
and
then,
if
you
need
to
modify
the
articles
or
create
a
nurse
or
create
additional
content,
you
would
still
use
the
SharePoint
share,
control
and
experience.
But
from
a
consuming
perspective
you
can
access
the
information
directly
from
Microsoft
themes
and
that's
actually
pretty
cool
from
a
consuming
consumer
side
perspective.
A
A
So
one
of
the
things
which
is
important
to
notice
again,
depending
on
the
settings
so
I
have
now
the
company
intranet
installed
as
my
personal
application
or
slightly
depending
on
settings
I
might
have
to
be
an
option
which
basically
means
that
I
can
pin
my
own
personal
applications
to
be
available
in
the
left
menu,
and
that
means
that
if
I
go
back
in
the
team,
if
I
go
back
in
any
of
the
my
channels
and
I
can
have
a
discussion
with
my
colleagues.
That
solution
remains
on
the
left
nav
occasions
and
that's
pretty
cool.
A
But
how
would
I
force
all
of
my
employees
to
actually
is
it
an
application
in
the
left
navigation
and
that's
where
actually,
our
Microsoft
teams
application
policies
on
the
ones
which
we
can
use
to
set
up
things,
so
we
can
go,
for
example,
the
global
or
a
quite
default,
and
we
can
add
additional
applications
in
here.
Now
we
can
go
and
add
a
new
application.
A
Navigation
for
all
of
our
employees
by
default
and
clicking
save
will
then
means
that,
after
a
while,
whoever
opens
up
the
Mike's
of
teams
will
have
by
default
in
the
company
application
visible
as
the
version
first
entry
in
the
Mike's
of
themes
and
that's
actually
pretty
cool,
so
you
can
actually
control
what
is
the
default
setup
and
what
are
the
applications
being
visible
for
your
employees
and
what
are
the
information
and
they
can
access
now?
What's
really
really
important,
also
to
notice,
let's
double
check
that
this
one
is
working.
A
Probably
the
same
experience
actually
works
properly
inside
of
the
Microsoft
team's
desktop.
So
here's
the
desktop
client,
it's
actually
going
there.
We
can
see
that
the
company
internet
working
properly
in
the
web
clients,
but
if
I,
will
actually
add
or
find
the
intranet
from
here
I
can
actually
find
the
company
intranet
in
my
site
in
the
district
lines
as
well.
I
can
add
that
to
the
left
navigation
as
a
personal
application,
and
it's
already
actually
being
at
it,
and
that
means
that
I
can
click
three
don'ts.
A
The
reason
why
it's
actually
not
visible
in
here
as
such
is
that
it
doesn't
actually
refresh
I
was
just
adding
that
in
website.
So
it's
not
yet
too
refreshed
in
here.
Let's
actually
go
in
here.
Let's
see
if
I
can
actually
visible
and
added.
Oh,
it's
already
added
so
now,
I
need
to
actually
refresh
the
page
or
wait
until
the
the
setup
will
actually
refresh
to
get
the
company
application
to
be
visible
in
here
as
well.
So,
let's
see
if
we
can
actually
find
how
we
can
refresh
the
UX
as
easy
as
possible.
A
And
there
we
can
actually
say
that,
so
it
takes
a
while
to
refresh
what
I
did
here
is
just
a
force
to
check
down
and
check
in
which
then
basically
refreshed
my
setup
of
application,
and
this
mainly
because
the
I
was
doing
the
setup
and
configuration
and
installation
and
all
that
stuff
super
fast.
And
that
means
that
there,
caching
and
refreshing
didn't
actually
stop
and
jump
in,
but
I
can
see
now
the
component
application.
A
Sorry
could
company
intranet
being
install
to
myself
and
we
can
access
the
company
intranet
properly
from
the
desktop
client
as
well,
and
that's
actually
pretty
pretty
cool.
Oh
so
they
actually
say
that
it's
visible
in
here
and
then,
obviously
you
can
access
the
information
you
can
access
the
pages
in
the
corporation
for
corporate.
A
We
have
the
SharePoint
site
and
the
modern
pages,
and
then,
in
this
case
the
corporate
intranet
reading
the
latest
news
we're
getting
the
latest
information
whatever
is
being
exposed
here
and
the
main
idea
idea
here,
however,
is
exposing
individual
pages,
and,
as
you
can
see,
the
top
navigation
is
missing
from
the
desktop
client
as
well,
and,
like
said,
we
aren't
working
on
the
improvements
in
here
right
now,
when
this
video
is
really
being
recorded
in
June
2020.
This
is
the
experience
and
there's
no
way
for
exposing
that
additional
navigation
row.
A
What,
as
such,
you
can
do
have
multiple
different
tabs
in
your
personal
solution,
which
would
be
a
one
way
of
actually
exposing
multiple
different
sites.
We
would
want
to
bundle
in
multiple,
multiple
configurations
in
a
single
setup
now.
One
other
thing
which
is
important
to
realize
is
that
in
this
case,
we
only
create
it
the
money,
a
single
application.
We
created
a
personal
application
which
is
in
the
left
navigation
in
here.
A
You
can
actually
create
also
theme
stamps,
which
would
then
be
able
to
enable
you
to
expose
whatever
shim
or
ownership
on
pages
inside
of
Microsoft
themes
channel.
So
that
would
be
a
one
option
to
actually
expose
things
as
well,
so
both
of
them
do
work.
Both
of
them
are
in
a
preview
integration
mode
and
they
will
be
getting
better
and
better
for
me,
integration
perspective,
but
that's
pretty
much
what
we
did
here
so
we
wanted
to
expose
and
the
modern
SharePoint
experiment
portal.
A
Inside
of
the
Microsoft
teams,
we
did
not
using
the
personal
application
mode
now
quite
simple
setup,
it's
just
matter
of
setting
the
URLs
properly
and
then
knowing
about
the
limitations
which
is
on
there
for
now,
which
are
getting
addressed
gradually.
So
you
will
have
a
better
and
better
experience
with
this
embedding
or
integration
in
the
future
as
well.
A
If
you
have
any
questions,
please
do
reach
out
and
have
questions
related
on
this
one
using
our
community
channels
and
other
channels
and
we're
more
than
happy
to
help
and
get
your
feedback
around
this
capabilities,
and
please
get
your
also
familiar
related
on
the
Microsoft
themes,
policies
and
policies,
because
these
will
help
you
to
control.
What
is
the
visibility
of
your
setup
and
the
functionality
for
individual
employees
and
what's
super
super
cool.
Definitely
in
here
is
that
you
can
actually
have
multiple
different
policies.
Multiple
configurations
based
on,
for
example,
organizational
differences.
A
So
you
can
pinpoint
different
URLs
in
one
different
portals,
different
capabilities
and
applications
in
the
left
menu
as
well,
but
anyway,
that's
what
we
wanted
to
actually
show
in
this
video
and
showing
that
it
actually
works
in
the
both
web
client
and
also
in
the
desktop
client,
and
obviously
it
would
work
in
a
mobile
client
as
well
as
long
as
you
follow
up
on
this
updated
guidance
and
updated
tutorial
which
is
available
in
our
documentation.
Thank
you
for
watching
and
one
more
time
keep
the
feedback
coming.
Thank
you.