添加链接
link管理
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接

Hey @hjender this will depend on whether you are using a custom tempalte or using HubSpot's template builder.

If the latter, follow the instructions below to access the template editor.  The module you'll want to edit is called 'Post Body'.

Now CSS isn't my forte, but I've noticed some experts around here. @ndwilliams3 could you confirm how best to style this component to expand / reduce the width?

How can I edit my blog template?

  • In your HubSpot Marketing account, navigate to Content > Blog .
  • Next, at the top left of this dashboard, use the dropdown menu to select the specific blog you want to edit.

  • After selecting the blog, click View blog to view it live.

  • Once on your live blog, click the HubSpot sprocket icon located at the top-right and choose Edit Blog Layout – doing so will take you directly to the template the blog page you selected uses as its layout.

  • Each module and module group contains a gear icon with selections to edit modules and groups accordingly. Edit each module as needed or drag and drop modules around to different locations in your template.

User-added image

  • Click on Publish Changes when you're ready to take your edits live.

Hey @hjender this will depend on whether you are using a custom tempalte or using HubSpot's template builder.

If the latter, follow the instructions below to access the template editor.  The module you'll want to edit is called 'Post Body'.

Now CSS isn't my forte, but I've noticed some experts around here. @ndwilliams3 could you confirm how best to style this component to expand / reduce the width?

How can I edit my blog template?

  • In your HubSpot Marketing account, navigate to Content > Blog .
  • Next, at the top left of this dashboard, use the dropdown menu to select the specific blog you want to edit.

  • After selecting the blog, click View blog to view it live.

  • Once on your live blog, click the HubSpot sprocket icon located at the top-right and choose Edit Blog Layout – doing so will take you directly to the template the blog page you selected uses as its layout.

  • Each module and module group contains a gear icon with selections to edit modules and groups accordingly. Edit each module as needed or drag and drop modules around to different locations in your template.

User-added image

  • Click on Publish Changes when you're ready to take your edits live.
You can access the CSS files for your blog template under  Edit > Edit Head in Design Manager. As far as the actual CSS, this would depend on your specific template. If you need help there, p... You can access the CSS files for your blog template under  Edit > Edit Head in Design Manager. As far as the actual CSS, this would depend on your specific template. If you need help there, p... Developers Feb 2, 2018 //START END-USER CONFIGURATION //------------------------------ //selectors for hover card triggers var allHoverCardTriggers = '.author-name-link,.friend-list .friend a,.username a,.avatar,.user-avatar,.author-img, .authors a, .messageauthorusername a, a.lia-user-name-link, .js-latest-post-by-from a, .user-online-list li a, a.UserAvatar, .customUsersOnline a, #authors a,.dashboard-followers a.user-name, .dashboard-following a.user-name,.author-login-wrapper a, .hb-leaderboard a, .author-img-floated'; // Forward calling page's URL params to endpoint URL as well, helps with testing! var params = (new URL(location.href)).searchParams; var userApiUrl = '/plugins/custom/hubspot/hubspot/hovercardendpoint?' + ((params.set('user_id', '') == []._) && params.toString()); if($('.hover-card-container').length<1){ $('body').append('
'); var cardWrapper = $('.hover-card-container'); var error = false; var thisUserID = ''; var thisUserLogin = ''; var userLink =''; var cardTimer; var leaveTimer; function mouseenter(Elem) { var thisEl = Elem; cardTimer = setTimeout(function(){ var docWidth = $(document).width(); var rightSide = false; var userLink = thisEl.attr('href'); if($('.ViewProfilePage').length && $('img.lia-user-avatar-profile',thisEl).length){thisUserID = '';} else if(thisEl.attr('href')=='#' || thisEl.attr('href')=='' || !userLink.match('viewprofilepage')){ return false;} else{ var thisLen = (userLink).split('/'); thisUserID = (thisLen)[thisLen.length-1]; var thisCard = $('.profileCard[data-user='+thisUserID+']',cardWrapper); var cardId = 'userProfileCard-'+ thisUserID; var addAttr = thisEl.attr('aria-describedby',cardId); var thisElTopOffset = Math.round(thisEl.offset().top+(thisEl.height()/2)+30); var thisElbottomoffset = "auto"; var className = ""; var winHeight = $(window).height(); var elOffset = thisEl.offset(); var scrollTop = $(window).scrollTop(); var elementOffset = thisEl.offset().top; var distanceTop = (elementOffset - scrollTop); var distanceBottom = (winHeight + scrollTop) - (elOffset.top + thisEl.outerHeight(true)); var distanceLeft = Math.round(thisEl.offset().left); var bodyHight = $('body').height(); var topParam = ''; var bottomparam = ''; var position = ''; var className = 'topArrow'; cardId if(distanceBottom < 300 ){ if(distanceLeft < 59){ thisCard.removeClass('bottomArrow'); var className = 'leftArrow'; var distanceLeft = (distanceLeft)+(39); var thisElTopOffset = (thisElTopOffset)-(150); }else{ var thisElTopOffset = (thisElTopOffset)-(301); var className = 'bottomArrow'; thisCard.removeClass('topArrow'); thisCard.removeClass('leftArrow'); var distanceLeft = (distanceLeft)-(45); else{ if(distanceLeft < 59){ thisCard.removeClass('topArrow'); var className = 'leftArrow'; var distanceLeft = (distanceLeft)+(39); var thisElTopOffset = (thisElTopOffset)-(150); }else{ thisCard.removeClass('leftArrow'); thisCard.removeClass('bottomArrow').addClass('topArrow'); var distanceLeft = (distanceLeft)-(45); if(thisCard.length && $('.profileCard[data-user='+thisUserID+'] .preloader',cardWrapper).length<1){ $('.profileCard',cardWrapper).hide(); thisCard.addClass(className); rightSide?thisCard.addClass('rightArrow'):thisCard.removeClass('rightArrow'); thisCard.delay(0).css({'top':(thisElTopOffset),'left':distanceLeft,'bottom':thisElbottomoffset}).fadeIn(); } else { var ajaxReturn = ''; //just in case thisCard.remove(); //hover card wrapper markup var rightArrowClass = rightSide?'rightArrow':''; if(thisElTopOffset != "auto"){ topParam = 'px'; if(thisElbottomoffset != "auto"){ bottomparam = 'px'; var profileCardHtml = '