Edit in JSFiddle

var token = null;
var keyApp = 'obRd6pCqjwNeujr6ko*xXA((';
var accTok = "";
SE.init({
    clientId: 2831,
    key: keyApp,
    channelUrl: 'http://fiddle.jshell.net/',
    complete: auth
});

function auth(data) {
    SE.authenticate({
        scope: ['read_inbox'],
        success: function (data) {
            token = data;
            accTok = "key=" + keyApp + "&access_token=" + token.accessToken;
            continueLoading();
        },
        error: function (data) {
            alert('Я не получил доступ :(');
        }
    });
}

function profile(data) {
    var items = data.items[0];
    $("#reputation").text("Рейтинг: " + items.reputation);
    $("#login").text(items.display_name);
    $("#bronze_badges").text("Бронзовых: " + items.badge_counts.bronze);
    $("#silver_badges").text("Серебряных: " + items.badge_counts.silver);
    $("#gold_badges").text("Золотых: " + items.badge_counts.gold);
    $("#profile_image").attr("src", items.profile_image);
}

function notify(data) {
    var items = data.items;
    var html = "<center>Последние уведомления</center><br/>";
    for (var i = 0; i < items.length; i++) {
        var site = items[i].site.name;
        var icon = items[i].site.icon_url;
        var body = items[i].body;
        var str = "<div class = 'item'><img src = '" + icon + "' height = '14px' />&nbsp;" + site + ":&nbsp;" + body + "</div>";
        html += str;
    }
    $("#notifications").html(html);
}

function continueLoading() {
    $.get("https://api.stackexchange.com/2.2/me?site=stackoverflow&" + accTok, profile);
    $.get("https://api.stackexchange.com//2.2/notifications?pagesize=10&" + accTok, notify);
}

<div class="profile">
    <div id="avatar">
        <img id="profile_image" src="" height="32px" />
    </div>
    <div class="profile_attr">
        <div id="login">Unknown Login</div>
        <div id="reputation">Unknown reputation</div>
    </div>
</div>
<div class="badges">Значки:
    <div id="bronze_badges">0</div>
    <div id="silver_badges">0</div>
    <div id="gold_badges">0</div>
</div>
<div id="notifications"></div>

body {
    background-color: #efefef;
    font-size: 14px;
    font-family:"Open Sans" sans-serif;
}
#avatar, .profile_attr, .badges, .badge_icons, .badge_icons, #bronze_badges, #silver_badges, #gold_badges, .profile {
    display: inline-block;
}
.profile_attr {
    top: 9px;
    left: 46px;
    position: absolute;
}
.badges {
    position: absolute;
    left: 190px;
    top: 9px;
}
#notifications {
    border: 4px double black;
    width: 100%;
}