LnRiLWhlYWRpbmcuaGFzLWJhY2tncm91bmR7cGFkZGluZzowfQ==
LnRiLWNvbnRhaW5lciAudGItY29udGFpbmVyLWlubmVye3dpZHRoOjEwMCU7bWFyZ2luOjAgYXV0b30gLndwLWJsb2NrLXRvb2xzZXQtYmxvY2tzLWNvbnRhaW5lci50Yi1jb250YWluZXJbZGF0YS10b29sc2V0LWJsb2Nrcy1jb250YWluZXI9ImI0ZDBlYzgyMGQwNWY3MzFmZTg3OGI5MDIzMjAyOWI0Il0geyBib3JkZXItcmFkaXVzOiAyMHB4O2JhY2tncm91bmQ6IHJnYmEoIDI1NSwgMjU1LCAyNTUsIDEgKTtwYWRkaW5nOiAyMHB4O2JveC1zaGFkb3c6IDJweCAycHggN3B4IDAgcmdiYSggMTQsIDMyLCA1NCwgMC4xNCApOyB9IGgzLnRiLWhlYWRpbmdbZGF0YS10b29sc2V0LWJsb2Nrcy1oZWFkaW5nPSJhYTk1MjliN2IwYTIwNzg2MGIzNTI5NmM4Y2MwMTRiYiJdICB7IHRleHQtYWxpZ246IGxlZnQ7cGFkZGluZy10b3A6IDA7bWFyZ2luLXRvcDogMDsgfSAgLnRiLWdyaWQsLnRiLWdyaWQ+LmJsb2NrLWVkaXRvci1pbm5lci1ibG9ja3M+LmJsb2NrLWVkaXRvci1ibG9jay1saXN0X19sYXlvdXR7ZGlzcGxheTpncmlkO2dyaWQtcm93LWdhcDoyNXB4O2dyaWQtY29sdW1uLWdhcDoyNXB4fS50Yi1ncmlkLWl0ZW17YmFja2dyb3VuZDojZDM4YTAzO3BhZGRpbmc6MzBweH0udGItZ3JpZC1jb2x1bW57ZmxleC13cmFwOndyYXB9LnRiLWdyaWQtY29sdW1uPip7d2lkdGg6MTAwJX0udGItZ3JpZC1jb2x1bW4udGItZ3JpZC1hbGlnbi10b3B7d2lkdGg6MTAwJTtkaXNwbGF5OmZsZXg7YWxpZ24tY29udGVudDpmbGV4LXN0YXJ0fS50Yi1ncmlkLWNvbHVtbi50Yi1ncmlkLWFsaWduLWNlbnRlcnt3aWR0aDoxMDAlO2Rpc3BsYXk6ZmxleDthbGlnbi1jb250ZW50OmNlbnRlcn0udGItZ3JpZC1jb2x1bW4udGItZ3JpZC1hbGlnbi1ib3R0b217d2lkdGg6MTAwJTtkaXNwbGF5OmZsZXg7YWxpZ24tY29udGVudDpmbGV4LWVuZH1oNC50Yi1oZWFkaW5nW2RhdGEtdG9vbHNldC1ibG9ja3MtaGVhZGluZz0iYWM2M2I4NGE0OTViYTA3YWUyOTVmOTQ0N2U5NjFiYTEiXSAgeyBwYWRkaW5nLXRvcDogMDttYXJnaW4tdG9wOiA2MHB4OyB9ICAudGItZmllbGRzLWFuZC10ZXh0W2RhdGEtdG9vbHNldC1ibG9ja3MtZmllbGRzLWFuZC10ZXh0PSJmYzY1OWY1YmRlMWE4MDU2ODdhYjNhY2I1MzRkOTU5YSJdIHsgbWFyZ2luLWJvdHRvbTogMzBweDsgfSAgLnRiLWJ1dHRvbntjb2xvcjojZjFmMWYxfS50Yi1idXR0b24tLWxlZnR7dGV4dC1hbGlnbjpsZWZ0fS50Yi1idXR0b24tLWNlbnRlcnt0ZXh0LWFsaWduOmNlbnRlcn0udGItYnV0dG9uLS1yaWdodHt0ZXh0LWFsaWduOnJpZ2h0fS50Yi1idXR0b25fX2xpbmt7Y29sb3I6aW5oZXJpdDtjdXJzb3I6cG9pbnRlcjtkaXNwbGF5OmlubGluZS1ibG9jaztsaW5lLWhlaWdodDoxMDAlO3RleHQtZGVjb3JhdGlvbjpub25lICFpbXBvcnRhbnQ7dGV4dC1hbGlnbjpjZW50ZXI7dHJhbnNpdGlvbjphbGwgMC4zcyBlYXNlfS50Yi1idXR0b25fX2xpbms6aG92ZXIsLnRiLWJ1dHRvbl9fbGluazpmb2N1cywudGItYnV0dG9uX19saW5rOnZpc2l0ZWR7Y29sb3I6aW5oZXJpdH0udGItYnV0dG9uX19saW5rOmhvdmVyIC50Yi1idXR0b25fX2NvbnRlbnQsLnRiLWJ1dHRvbl9fbGluazpmb2N1cyAudGItYnV0dG9uX19jb250ZW50LC50Yi1idXR0b25fX2xpbms6dmlzaXRlZCAudGItYnV0dG9uX19jb250ZW50e2ZvbnQtZmFtaWx5OmluaGVyaXQ7Zm9udC1zdHlsZTppbmhlcml0O2ZvbnQtd2VpZ2h0OmluaGVyaXQ7bGV0dGVyLXNwYWNpbmc6aW5oZXJpdDt0ZXh0LWRlY29yYXRpb246aW5oZXJpdDt0ZXh0LXNoYWRvdzppbmhlcml0O3RleHQtdHJhbnNmb3JtOmluaGVyaXR9LnRiLWJ1dHRvbl9fY29udGVudHt2ZXJ0aWNhbC1hbGlnbjptaWRkbGU7dHJhbnNpdGlvbjphbGwgMC4zcyBlYXNlfS50Yi1idXR0b25fX2ljb257dHJhbnNpdGlvbjphbGwgMC4zcyBlYXNlO2Rpc3BsYXk6aW5saW5lLWJsb2NrO3ZlcnRpY2FsLWFsaWduOm1pZGRsZTtmb250LXN0eWxlOm5vcm1hbCAhaW1wb3J0YW50fS50Yi1idXR0b25fX2ljb246OmJlZm9yZXtjb250ZW50OmF0dHIoZGF0YS1mb250LWNvZGUpO2ZvbnQtd2VpZ2h0Om5vcm1hbCAhaW1wb3J0YW50fS50Yi1idXR0b25fX2xpbmt7YmFja2dyb3VuZC1jb2xvcjojNDQ0O2JvcmRlci1yYWRpdXM6MC4zZW07Zm9udC1zaXplOjEuM2VtO21hcmdpbi1ib3R0b206MC43NmVtO3BhZGRpbmc6MC41NWVtIDEuNWVtIDAuNTVlbX0gLnRiLWJ1dHRvbltkYXRhLXRvb2xzZXQtYmxvY2tzLWJ1dHRvbj0iN2I4OTdmOTE2MjNlMzJmZGY3ODEwMWYzYTA5NzZkNWIiXSAudGItYnV0dG9uX19saW5rIHsgYmFja2dyb3VuZC1jb2xvcjogcmdiYSggMjQ4LCAxNDksIDMzLCAxICk7Ym9yZGVyLXJhZGl1czogMjBweDtjb2xvcjogcmdiYSggMjU1LCAyNTUsIDI1NSwgMSApO2ZvbnQtc2l6ZTogMjBweDtjb2xvcjogcmdiYSggMjU1LCAyNTUsIDI1NSwgMSApOyB9IC50Yi1idXR0b25bZGF0YS10b29sc2V0LWJsb2Nrcy1idXR0b249IjdiODk3ZjkxNjIzZTMyZmRmNzgxMDFmM2EwOTc2ZDViIl0gLnRiLWJ1dHRvbl9faWNvbiB7IGZvbnQtZmFtaWx5OiBkYXNoaWNvbnM7IH0gQG1lZGlhIG9ubHkgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3ODFweCkgeyAudGItY29udGFpbmVyIC50Yi1jb250YWluZXItaW5uZXJ7d2lkdGg6MTAwJTttYXJnaW46MCBhdXRvfSAudGItZ3JpZCwudGItZ3JpZD4uYmxvY2stZWRpdG9yLWlubmVyLWJsb2Nrcz4uYmxvY2stZWRpdG9yLWJsb2NrLWxpc3RfX2xheW91dHtkaXNwbGF5OmdyaWQ7Z3JpZC1yb3ctZ2FwOjI1cHg7Z3JpZC1jb2x1bW4tZ2FwOjI1cHh9LnRiLWdyaWQtaXRlbXtiYWNrZ3JvdW5kOiNkMzhhMDM7cGFkZGluZzozMHB4fS50Yi1ncmlkLWNvbHVtbntmbGV4LXdyYXA6d3JhcH0udGItZ3JpZC1jb2x1bW4+Knt3aWR0aDoxMDAlfS50Yi1ncmlkLWNvbHVtbi50Yi1ncmlkLWFsaWduLXRvcHt3aWR0aDoxMDAlO2Rpc3BsYXk6ZmxleDthbGlnbi1jb250ZW50OmZsZXgtc3RhcnR9LnRiLWdyaWQtY29sdW1uLnRiLWdyaWQtYWxpZ24tY2VudGVye3dpZHRoOjEwMCU7ZGlzcGxheTpmbGV4O2FsaWduLWNvbnRlbnQ6Y2VudGVyfS50Yi1ncmlkLWNvbHVtbi50Yi1ncmlkLWFsaWduLWJvdHRvbXt3aWR0aDoxMDAlO2Rpc3BsYXk6ZmxleDthbGlnbi1jb250ZW50OmZsZXgtZW5kfSAgLnRiLWJ1dHRvbntjb2xvcjojZjFmMWYxfS50Yi1idXR0b24tLWxlZnR7dGV4dC1hbGlnbjpsZWZ0fS50Yi1idXR0b24tLWNlbnRlcnt0ZXh0LWFsaWduOmNlbnRlcn0udGItYnV0dG9uLS1yaWdodHt0ZXh0LWFsaWduOnJpZ2h0fS50Yi1idXR0b25fX2xpbmt7Y29sb3I6aW5oZXJpdDtjdXJzb3I6cG9pbnRlcjtkaXNwbGF5OmlubGluZS1ibG9jaztsaW5lLWhlaWdodDoxMDAlO3RleHQtZGVjb3JhdGlvbjpub25lICFpbXBvcnRhbnQ7dGV4dC1hbGlnbjpjZW50ZXI7dHJhbnNpdGlvbjphbGwgMC4zcyBlYXNlfS50Yi1idXR0b25fX2xpbms6aG92ZXIsLnRiLWJ1dHRvbl9fbGluazpmb2N1cywudGItYnV0dG9uX19saW5rOnZpc2l0ZWR7Y29sb3I6aW5oZXJpdH0udGItYnV0dG9uX19saW5rOmhvdmVyIC50Yi1idXR0b25fX2NvbnRlbnQsLnRiLWJ1dHRvbl9fbGluazpmb2N1cyAudGItYnV0dG9uX19jb250ZW50LC50Yi1idXR0b25fX2xpbms6dmlzaXRlZCAudGItYnV0dG9uX19jb250ZW50e2ZvbnQtZmFtaWx5OmluaGVyaXQ7Zm9udC1zdHlsZTppbmhlcml0O2ZvbnQtd2VpZ2h0OmluaGVyaXQ7bGV0dGVyLXNwYWNpbmc6aW5oZXJpdDt0ZXh0LWRlY29yYXRpb246aW5oZXJpdDt0ZXh0LXNoYWRvdzppbmhlcml0O3RleHQtdHJhbnNmb3JtOmluaGVyaXR9LnRiLWJ1dHRvbl9fY29udGVudHt2ZXJ0aWNhbC1hbGlnbjptaWRkbGU7dHJhbnNpdGlvbjphbGwgMC4zcyBlYXNlfS50Yi1idXR0b25fX2ljb257dHJhbnNpdGlvbjphbGwgMC4zcyBlYXNlO2Rpc3BsYXk6aW5saW5lLWJsb2NrO3ZlcnRpY2FsLWFsaWduOm1pZGRsZTtmb250LXN0eWxlOm5vcm1hbCAhaW1wb3J0YW50fS50Yi1idXR0b25fX2ljb246OmJlZm9yZXtjb250ZW50OmF0dHIoZGF0YS1mb250LWNvZGUpO2ZvbnQtd2VpZ2h0Om5vcm1hbCAhaW1wb3J0YW50fS50Yi1idXR0b25fX2xpbmt7YmFja2dyb3VuZC1jb2xvcjojNDQ0O2JvcmRlci1yYWRpdXM6MC4zZW07Zm9udC1zaXplOjEuM2VtO21hcmdpbi1ib3R0b206MC43NmVtO3BhZGRpbmc6MC41NWVtIDEuNWVtIDAuNTVlbX0gfSBAbWVkaWEgb25seSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDU5OXB4KSB7IC50Yi1jb250YWluZXIgLnRiLWNvbnRhaW5lci1pbm5lcnt3aWR0aDoxMDAlO21hcmdpbjowIGF1dG99IC50Yi1ncmlkLC50Yi1ncmlkPi5ibG9jay1lZGl0b3ItaW5uZXItYmxvY2tzPi5ibG9jay1lZGl0b3ItYmxvY2stbGlzdF9fbGF5b3V0e2Rpc3BsYXk6Z3JpZDtncmlkLXJvdy1nYXA6MjVweDtncmlkLWNvbHVtbi1nYXA6MjVweH0udGItZ3JpZC1pdGVte2JhY2tncm91bmQ6I2QzOGEwMztwYWRkaW5nOjMwcHh9LnRiLWdyaWQtY29sdW1ue2ZsZXgtd3JhcDp3cmFwfS50Yi1ncmlkLWNvbHVtbj4qe3dpZHRoOjEwMCV9LnRiLWdyaWQtY29sdW1uLnRiLWdyaWQtYWxpZ24tdG9we3dpZHRoOjEwMCU7ZGlzcGxheTpmbGV4O2FsaWduLWNvbnRlbnQ6ZmxleC1zdGFydH0udGItZ3JpZC1jb2x1bW4udGItZ3JpZC1hbGlnbi1jZW50ZXJ7d2lkdGg6MTAwJTtkaXNwbGF5OmZsZXg7YWxpZ24tY29udGVudDpjZW50ZXJ9LnRiLWdyaWQtY29sdW1uLnRiLWdyaWQtYWxpZ24tYm90dG9te3dpZHRoOjEwMCU7ZGlzcGxheTpmbGV4O2FsaWduLWNvbnRlbnQ6ZmxleC1lbmR9ICAudGItYnV0dG9ue2NvbG9yOiNmMWYxZjF9LnRiLWJ1dHRvbi0tbGVmdHt0ZXh0LWFsaWduOmxlZnR9LnRiLWJ1dHRvbi0tY2VudGVye3RleHQtYWxpZ246Y2VudGVyfS50Yi1idXR0b24tLXJpZ2h0e3RleHQtYWxpZ246cmlnaHR9LnRiLWJ1dHRvbl9fbGlua3tjb2xvcjppbmhlcml0O2N1cnNvcjpwb2ludGVyO2Rpc3BsYXk6aW5saW5lLWJsb2NrO2xpbmUtaGVpZ2h0OjEwMCU7dGV4dC1kZWNvcmF0aW9uOm5vbmUgIWltcG9ydGFudDt0ZXh0LWFsaWduOmNlbnRlcjt0cmFuc2l0aW9uOmFsbCAwLjNzIGVhc2V9LnRiLWJ1dHRvbl9fbGluazpob3ZlciwudGItYnV0dG9uX19saW5rOmZvY3VzLC50Yi1idXR0b25fX2xpbms6dmlzaXRlZHtjb2xvcjppbmhlcml0fS50Yi1idXR0b25fX2xpbms6aG92ZXIgLnRiLWJ1dHRvbl9fY29udGVudCwudGItYnV0dG9uX19saW5rOmZvY3VzIC50Yi1idXR0b25fX2NvbnRlbnQsLnRiLWJ1dHRvbl9fbGluazp2aXNpdGVkIC50Yi1idXR0b25fX2NvbnRlbnR7Zm9udC1mYW1pbHk6aW5oZXJpdDtmb250LXN0eWxlOmluaGVyaXQ7Zm9udC13ZWlnaHQ6aW5oZXJpdDtsZXR0ZXItc3BhY2luZzppbmhlcml0O3RleHQtZGVjb3JhdGlvbjppbmhlcml0O3RleHQtc2hhZG93OmluaGVyaXQ7dGV4dC10cmFuc2Zvcm06aW5oZXJpdH0udGItYnV0dG9uX19jb250ZW50e3ZlcnRpY2FsLWFsaWduOm1pZGRsZTt0cmFuc2l0aW9uOmFsbCAwLjNzIGVhc2V9LnRiLWJ1dHRvbl9faWNvbnt0cmFuc2l0aW9uOmFsbCAwLjNzIGVhc2U7ZGlzcGxheTppbmxpbmUtYmxvY2s7dmVydGljYWwtYWxpZ246bWlkZGxlO2ZvbnQtc3R5bGU6bm9ybWFsICFpbXBvcnRhbnR9LnRiLWJ1dHRvbl9faWNvbjo6YmVmb3Jle2NvbnRlbnQ6YXR0cihkYXRhLWZvbnQtY29kZSk7Zm9udC13ZWlnaHQ6bm9ybWFsICFpbXBvcnRhbnR9LnRiLWJ1dHRvbl9fbGlua3tiYWNrZ3JvdW5kLWNvbG9yOiM0NDQ7Ym9yZGVyLXJhZGl1czowLjNlbTtmb250LXNpemU6MS4zZW07bWFyZ2luLWJvdHRvbTowLjc2ZW07cGFkZGluZzowLjU1ZW0gMS41ZW0gMC41NWVtfSB9IA==
Add Jump Link(s)
Updated on February 26, 2024
Jumps links are used to send users to a specific areas within a page. Below are examples. These links can be helpful on pages with a lot of content or in instances when you know exactly where you’d like a viewer to be taken.
Instructions
Rules of IDs
** Row & Widget IDs names have to be done in a specific way.**
- IDs must be all lowercase.
- Spaces cannot be included. Feel free to use a dash or underscore in place of a space.
- IDs must be unique. Don’t use the same id twice. I find it helpful to make sure the id is specific to the page.
Example: I’m on an about page and plan to add a jump link to the company’s history further down on the page. I would add “about-history” as the id for the history widget block.
Add the Target
Consider how the page looks on mobile when building your jump links.
Target is a word or phrase in a text block
- Go to back end of the page where users will be sent when they click on your jump link.
- Hover over the text block and click “edit”.
- Change the view from Visual to Text to see the content as HTML coding.
- Find the word/phrase you’d like people to go to when they click the link. If that word/phrase has a header (<h4>) around it, you can add the id to the current header. You can also add a span tag around the text you’d like to add to (<span>Text Target Example</span). Now add space id=”” after the header code (h4) or the span tag. Examples: <h4 id=””> and <span id=””>
- Within the quotation you’ll put the target text. I usually do a simplified version of the word/phrase you’re linking to. Example: the header is Text Target Example. I would put targetexample as the target text. Reminder: IDs must be all lowercase without spaces and must be unique to the page. An id cannot be reused on that page or post.
- Add all the targets then copy the ids you created to a document so you know the spelling is correect in the next section of instructions.
- Switch the view back to Visual.
Target is a row or widget block
- Go to back end of the page where users will be sent when they click on your jump link.
- Full Row: Hover over the wrench icon in the top right corner of the desired row. Click “Edit Row”. You will see a row preview on the left and “Row Styles” on the right. Click “Attributes” and add a “Row ID”. **
– OR –
Individual Widget: Hover over the desired widget and click “Edit” in the top right corner of the block. Click “Attributes” from the “Row Styles” on the right. Add a “Widget ID”.**
- Click “Done” in the bottom right corner and “Update” your page.
**Please read Rules of IDs above.
Add the Link
Once the target is added to the page, you need to add the link you want visitors to click on.
Adding into Text
- Open the SiteOrigin Editor that contains the text you’d like to add the link to. Highlight the word or phrase you’d like to link to the target. Click the chain link icon. It will say “Insert/edit link (Ctrl+K)” when you hover over it.
- If the target you created is on the same page as the link text, place the id in the provided field PRECEDED by “#”. Example: #exampletarget
- If the target you created is on another page, go to the target page on the front end of the site. Copy the page’s web address. Paste that followed by “#” and your the id you created in the provided field. Example: [yourdomain.com]/aboutus#exampletarget
- Click “Done” in the bottom right corner.
- “Update” your page and verify that the text link works as expected on the site’s front end.
Adding as Button or Image Destination URL
- Open your SiteOrigin Button or SiteOrigin Image widget.
- If the target you created is on the page your button is on, place the id in the Destination URL field PRECEDED by “#”. Example: #exampletarget
- If the target you created is on another page, go to the target page on the front end of the site. Copy the page’s web address. Paste that followed by “#” and your the id you created in the Destination URL field. Example: [yourdomain.com]/aboutus#exampletarget
- Click “Done” in the bottom right corner.
- “Update” your page and verify that the button works as expected on the site’s front end.
Related Posts
