setzer

Hi gbearrin,

The snippet you mentioned is in CSS, which is the stylesheet language used to specify page elements’ appearance and formatting. There are many ways to add custom CSS like the above to your site, but maybe the easiest is with a custom CSS plugin. Simple Custom CSS is a good one. That plugin offers a simple text field into which you can place custom CSS statements like the one you mentioned.

Hi treepublican,

Sorry for the delay. Side Matter works under 3.9.1 with almost all themes. I’m not sure what’s happening with your Genesis child theme—it’s odd. On an unmodified install of Genesis 2.0.1, sidenotes show up OK for me. Would you be able to link to your site?

A suggestion: The Genesis authors are certain to have a better understanding of their theme’s quirks than I do, and it looks like they offer free support for customers. It might be worth giving them a shout as well.

Hi xammamax,

Hmm. I haven’t been able to reproduce this with the Nextgen plugin, but this sort of conflict does occasionally crop up with SEO/social-media plugins. Does changing any of the Nextgen plugin’s settings alter this behavior? I’m not sure of an answer off the top of my head, but might be able to isolate the issue if I could reproduce it.

It looks like the author of the Nextgen plugin is pretty active on that plugin’s support forum. That might be worth a shot as well.

Peculiar stuff. Usually there’s no problem with the reference numeral links jumping to the sidenotes. Is your site publicly available?

Editing side-matter.php isn’t a perfect solution since your edits won’t be preserved across plugin updates, but you can certainly do it without breaking anything. You want to edit line 495, which specifies the HTML markup for each reference numeral:

$ref_output = "<a id='ref-{$note_id}' class='{$html_class} {$html_class}-ref' href='#note-{$note_id}'{$figure_color_style}>{$open_sup}{$ref_figure}{$close_sup}</a>";

To remove the link, just get rid of the href attribute:

$ref_output = "<a id='ref-{$note_id}' class='{$html_class} {$html_class}-ref'{$figure_color_style}>{$open_sup}{$ref_figure}{$close_sup}</a>";

You may need to make some CSS adjustments to the appearance of the reference numerals after this change, as well.

Hi KTS915,

I’m not sure why the reference numeral links are sending viewers to the top of the page. They should link directly to the corresponding notes in the sidebar. Has this always been the case? If you just want to remove the links entirely (but leave the numerals), it might be easiest to do it with a quick modification of your side-matter.php file.

Re: your actual question, I’m afraid I don’t know a simple solution to the pointer-events: none issue. Is it possibly an issue with the :link pseudoclass you’re using? (That is, does it work if you just use a.side-matter { pointer-events: none; }?)

(Google does turn up a kind of complicated workaround that uses JS, but this seems like overkill for what you need.)

xammamax,

Sorry for the delayed response. Were you able to solve this problem? I hadn’t observed any issue generating references in headings before. For example, here is what the following post content looks like under the theme Twenty Twelve: image.

vis eu malis sanctus eligendi.
<h1>Heading[ref]Test sidenote[/ref]</h1>
Exerci singulis ne mei. Vim eu consetetur comprehensam, ferri temporibus eu sit, tritani

Keeping the [ref] shortcodes inside the heading tags seems to be the important thing here.

colmliamoneill,

Sorry for the delay in responding. This sort of problem is often caused by some bit of theme CSS. In this case, I would guess the issue has something to do with a CSS float (and perhaps other rules) being inadvertently applied to Side Matter elements.

Using your browser’s developer tools to inspect the Side Matter notes and toggle active CSS rules until you find the culprit is a good way to fix stubborn display issues like this one.

Hi wearingfilm,

Sorry for the belated response. This is a tricky problem. There’s no solution I know of that wouldn’t involve digging around in your theme or Side Matter. One rather crude approach might be to use the wp_is_mobile conditional function in the Side Matter plugin file to tell Side Matter “if the viewer is on a mobile device, don’t load the sidenote positioning script.”

Try replacing lines 361-368 of /wp-content/plugins/side-matter/side-matter.php with the following and see if it works:

wp_enqueue_style( 'side-matter', plugins_url( 'css/side-matter.css', __FILE__ ), null, $this->version );
if ( wp_is_mobile() ) return;
wp_enqueue_script( 'side-matter-js', plugins_url( 'js/side-matter.js', __FILE__ ), array( 'jquery' ), $this->version, true );
wp_localize_script( 'side-matter-js', 'side_matter', array(
	'is_responsive' => __( $this->options['is_responsive'] ),
	'use_effects' => __( $this->options['use_effects'] ),
	'note_adjust' => __( $this->options['note_adjust'] ),
	'html_class' => __( $this->options['html_class'] )
	) );

Hi stiangk,

Apologies for getting to this so belatedly. Have you been able to solve the problem? It appears you’ve removed the notes from the main page, so I am guessing not.

It may have to do with the homemade sidebar and/or some odd element of theme CSS.

Let me know if you’d like to give this another shot, and I can take a look.

Hi Olivia0906,

Yes, the plugin requires a sidebar to display notes. It won’t function properly with full-width designs that do not include a sidebar; the superscript reference numbers will appear in the text, but no notes will display.

Hope this is helpful.

Hi jbickers, sorry to have missed this. I’m not sure exactly what the issue is — I haven’t seen an option for customizing the sidebar color on Twenty Thirteen before. It may be a matter of CSS selector specificity, or something else. Can you post a link to your site?

Hi miguelripoli,

I’ve taken a look at that PDF plugin. Right now, there isn’t a simple way to do this without editing the plugin or writing a fair amount of code yourself.

Here’s a simple hack that will do the job, though it does require editing side-matter.php and so won’t be preserved over updates. Insert the following line of PHP between lines 495 and 496 of side-matter.php (1.4):

$ref_output .= "<span style='display: none;'> [{$note_id}. {$note_text}]</span>";

This appends the note text to each reference in brackets, but gives it a CSS property of display: none, making it (generally) not shown in the browser but visible on the PDF. You have to turn on the PDF plugin’s “Process Shortcodes” option for this to work.

Hi miguelripoll,

Good question. The developer of your PDF plugin would be better equipped to answer this question, but I’ll help if I can.

Side Matter actually generates the note text in two places: the reference’s title attribute (as you found), and an ol (ordered list) in the sidebar widget. I’d guess that your PDF plugin excludes sidebar content when converting the post, so the SM widget list doesn’t appear.

The PHP snippet do_action( 'side_matter_list_notes' ); will print the list of sidenotes anywhere you stick it, so perhaps you could add that to the printing queue of the PDF plugin, after the post content.

What plugin are you using?

bluebird2, when numerals are not displaying it’s almost always because of a list-style-type: none declaration in your theme stylesheet. One way to isolate the problem is by running a search on the theme’s style.css using your browser’s developer tools. You can also post a new support thread with a link to your site and I’ll take a look.

LeoG,

I suggest installing a plugin that enables shortcodes in WP comments. This plugin should do the trick — just add ref to its list of allowed shortcodes, and you should be able to generate Side Matter notes from comments. Hope that helps.